Get Started

You need to be a premium member to use this feature. To access it, you'll have to upgrade your membership.

Become a sharper developer and jumpstart your career.

Basic

$0

$

. 00

monthly

For Basic members:

  • Standard Profile
  • Access learning courses
  • Access free e-books
  • 1x point

Premium

$20

$

. 00

monthly

For Premium members:

  • Earn 2x reward points
  • Premium profile with Verified check
  • Premium Avatar with status update
  • Learning courses
  • Unlimited Certifications and badges on profile
  • Unlimited Book downloads
  • Access to Premium content
  • Online Training
  • Unlimited PDF conversions and downloads
  • Professional Resume Writing
  • Interview Preparations Guide
  • 25 messages per month
  • 1 "Kodzu" avatar, basic
Angular

ng-Disabled Directive in AngularJS

ng- disabled directive is used to enable or disable HTML elements. Let us see this with the help of an example.

Write the following HTML mark up in the webpage.

  1. <!doctype html>  
  2. <html ng-app>  
  3.   <head>  
  4.     <title>My Angular App</title>  
  5.     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>  
  6.   </head>  
  7.   <body>  
  8. <div ng-app="" ng-init="Switch=true">  
  9.    
  10. <p>  
  11. <input type="checkbox" ng-model="Switch"/>  
  12. </p>  
  13. <p>  
  14. <button ng-disabled="Switch">Submit</button>  
  15. </p>  
  16.    
  17. </div>   
  18.   </body>  
  19. </html>  
In the above example we have a checkbox and a button. If the checkbox is selected the button is disabled, but if we uncheck the checkbox then the button is enabled.

So let us check the output of the program.

output
When we select the checkbox let us see what happens!!
output
So the button is disabled. In this way we can enable or disable a control in AngularJS.

 
Ebook Download
View all
Learn
View all