Disabled ng-options in AngularJS: How to implement?

If you're working with AngularJS, you may come across a situation where you need to disable certain options in a dropdown list using the ng-options directive. Fortunately, this is a relatively easy task to accomplish.

To disable options in ng-options, you'll need to use the ng-disabled directive along with an expression that evaluates to true or false. This expression will determine whether or not each option is disabled.

Here's an example of how to disable options in ng-options:

<select ng-model="myModel" ng-options="item.name disable when item.disabled for item in items"></select>

In this example, each item in the "items" array has a "name" property and a "disabled" property. If the "disabled" property is true, the option will be disabled.

You can also use a function to determine whether or not an option should be disabled. Here's an example:

<select ng-model="myModel" ng-options="item.name disable when isDisabled(item) for item in items"></select>

$scope.isDisabled = function(item) {
  return item.disabled;

In this example, the isDisabled function takes an item as an argument and returns true or false based on whether or not the "disabled" property is true.

Overall, disabling options in ng-options is a simple task in AngularJS. By using the ng-disabled directive and an expression or function to evaluate each option, you can easily implement this functionality in your application.

Click to rate this post!
[Total: 0 Average: 0]

Related posts

Leave a Reply

Your email address will not be published. Required fields are marked *

Go up

Below we inform you of the use we make of the data we collect while browsing our pages. You can change your preferences at any time by accessing the link to the Privacy Area that you will find at the bottom of our main page. More Information