ng-class not taking both classes

Question

i have an ng-class like this

ng-class="{'alert alert-success': response.submitSuccess , 'alert alert-danger': !response.submitSuccess  }"

the problem is , suppose "response.submitSuccess" returns true , only alert-success class is added and not the alert class.

Answer 1

Doesn't it make more sense to make the alert class permanent then? (rhetorical question)

You can do it like this:

class="alert" ng-class="{'alert-success': response.submitSuccess , 'alert-danger': !response.submitSuccess}"

And this is the reason for the behaviour (it removes the alert class that was previously set by the !response.submitSuccess condition because it was falsy before):

When the expression changes, the previously added classes are removed and only then the new classes are added.

From: http://docs.angularjs.org/api/ng/directive/ngClass