Using ng-hide or ng-show on select box option

javascript angularjs directive
ThinkingInBits picture ThinkingInBits · Sep 9, 2013 · Viewed 27.3k times · Source

Is it possible to hide select box options using the ng-hide directive?

http://jsfiddle.net/cr4UB/

<div ng-app ng-controller="Controller">
    <select ng-model="myDropDown">
          <option value="one">One</option>
          <option value="two" ng-hide="myDropDown=='one'">Two</option>
          <option value="three">Three</option>
    </select>

    {{myDropDown}}
</div>

Answer

Chandermani picture Chandermani · Sep 9, 2013

AngularJS 1.1.5 has a directive ng-if which can work for you. Check this fiddle http://jsfiddle.net/cmyworld/bgsVw/

Related questions

How to get evaluated attributes inside a custom directive

I'm trying to get an evaluated attribute from my custom directive, but I can't find the right way of doing it. I've created this jsFiddle to elaborate. <div ng-controller="MyCtrl"> <input my-directive value="123"> <input my-directive …

Read More
How do I pass multiple attributes into an Angular.js attribute directive?

I have an attribute directive restricted as follows: restrict: "A" I need to pass in two attributes; a number and a function/callback, accessing them within the directive using the attrs object. If the directive was an element directive, restricted …

Read More
Append html to an element in directive and make a local function to interact with it

In my AngularJS application, I have different complex inputs everywhere. For example, some inputs have a directive to use autocompletion with Google Places or with autocompletion from Twitter Bootstrap. I'm searching for a way to make a directive which displays …

Read More