AngularJS Tutorial - Enable/Disable DOM Elements Conditionally

To disable a button depending on a checkbox state, use the ng-disabled directive and bind its condition to the checkbox state.

The following code shows how to enable/Disable DOM Elements Conditionally.

Example


<!doctype html>
<html ng-app>
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js"></script>
  </head><!--from   ww w  .  ja v a2  s .  c  o m-->
  <body ng-app>
    <label><input type="checkbox" ng-model="checked"/>Toggle Button</label>
    <button ng-disabled="checked">Press me</button>
  </body>
</html>

The code above is rendered as follows: