ng-class doesn't do what a simple css class does

Question

I was expecting ng-class to at least do what a simple class does i.e. apply a css property. In the plunker example, if the replace ng-class with class, it works and I get the indent. i.e. ng-class="indentLeft" doesn't work but class="indentLeft" does. What am I missing ?

See a simple plunker here: http://plnkr.co/edit/moLu0BmgEYVm3xFQDcw8?p=preview

Answer 1

ngClass requires an expression to evaluate.

ng-class="{'indentLeft' : (item == true)}"

The json structure is property name in '' is the class you want to apply and that property value detracted if it should be applied via true/false

String Expression

When you do this, ng-class="indentLeft" angularjs doesn't know that it is a string and most likely is trying to evaluate it from the scope.

If you wrap the property in '' and make it a string literal the plunker should work correctly

ng-class="\'indentLeft\'"

Updated plnkr