I'm wondering if it's possible to have a ng-class with class one time binded and class which are evaluated each digest cycle.
<div ng-class="{'one_time_binded_class': isMonkey(), 'not_one_time_binded_class': isUnicorn()}"></div>
I know I can one time bind the complete ng-class with ng-class="::{...}"
but my need is to one time bind a particular expression
Of course, this thing doesn't work :
<div ng-class="{'my_static_class': ::isMonkey(), 'my_dynamic_class': isUnicorn()}"></div>
Is there a way to do it ?
ng-style is used to interpolate javascript object into style attribute, not css class. And ng-class directive translates your object into class attribute.
The ngClass directive allows you to dynamically set CSS classes on an HTML element by databinding an expression that represents all classes to be added.
ngClass is more powerful. It allows you to bind a string of classes, an array of strings, or an object like in your example. The above two lines of code is with respect to CSS class binding in Angular. There are basically 2-3 ways you can bind css class to angular components.
Using multiple classes is the real reason to use the NgClass directive. You can think of NgClass as being able to specify multiple [class. class-name] on the same element.
Method 1:
class="some-class {{::expression ? 'my-class' : ''}}"
Method 2:
ng-class="::{'my-class': expression}"
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With