The ngClass
allows you to set CSS class on HTML element dynamically by databinding an
expression that represents all classes to be added.
The directive won't add duplicate classes if a particular class was already set.
When the expression changes, the previously added classes are removed and only then the classes new classes are added.
<ANY ng-class="{expression}"> ... </ANY>
<ANY class="ng-class: {expression};"> ... </ANY>
ngClass – {expression} –
Expression to eval. The result of the evaluation can be a string representing space delimited class names, an array, or a map of class names to boolean values.
<input type="button" value="set" ng-click="myVar='ng-invalid'"> <input type="button" value="clear" ng-click="myVar=''"> <br> <span ng-class="myVar">Sample Text </span>
it('should check ng-class', function() { expect(element('.doc-example-live span').prop('className')).not(). toMatch(/ng-invalid/); using('.doc-example-live').element(':button:first').click(); expect(element('.doc-example-live span').prop('className')). toMatch(/ng-invalid/); using('.doc-example-live').element(':button:last').click(); expect(element('.doc-example-live span').prop('className')).not(). toMatch(/ng-invalid/); });