AngularJS toggle class using ng-class

by

How to use conditional in ng-class:

Solution 1:

<i ng-class="{'icon-autoscroll': autoScroll, 'icon-autoscroll-disabled': !autoScroll}"></i>

Solution 2:

<i ng-class="{true: 'icon-autoscroll', false: 'icon-autoscroll-disabled'}[autoScroll]"></i>

Solution 3 (angular v.1.1.4+ introduced support for ternary operator):

<i ng-class="autoScroll ? 'icon-autoscroll' : 'icon-autoscroll-disabled'"></i>

Plunker

More Related Contents:

  1. Working with $scope.$emit and $scope.$on
  2. AngularJS with Django – Conflicting template tags
  3. Generate PDF from HTML using pdfMake in Angularjs
  4. Ternary operator in AngularJS templates
  5. Injecting a mock into an AngularJS service
  6. How to make a directive update ng-model on jquery on event?
  7. AngularJS – how to get an ngRepeat filtered result reference
  8. What is the $$ (double dollar sign) used for in angular?
  9. How do you serve a file for download with AngularJS or Javascript?
  10. Angular 2: Callback when ngFor has finished
  11. adding and removing classes in angularJs using ng-click
  12. How does the $resource `get` function work synchronously in AngularJS?
  13. Using Jquery Datatable with AngularJs
  14. How to debug angular protractor tests in WebStorm
  15. show validation error messages on submit in angularjs
  16. ‘load’ event not firing when iframe is loaded in Chrome
  17. Is AngularJS just for single-page applications (SPAs)?
  18. Using Inline Templates in AngularJS
  19. Including SVG template in Angularjs directive
  20. How can I listen for a click-and-hold in AngularJS?
  21. Pass Angular scope variable to Javascript
  22. Why do angularjs controller declaration have this syntax structure?
  23. Difference between $scope and $rootScope
  24. Iteration ng-repeat only X times in AngularJs
  25. Extending AngularJs Directive
  26. Using a Relative Path for a Service Call in AngularJS
  27. Angular UI-Router more Optional Parameters in one State
  28. Understanding the ngRepeat ‘track by’ expression
  29. How can I use an AngularJS filter to format a number to have leading zeros?
  30. Easy dom manipulation in AngularJS – click a button, then set focus to an input element

Leave a Comment