AngularJS ng-class not working for conditions

Question

This is very straightforward but I am not able to change the class.

I am basically verifying if the date is in correct format (DD-MMM-YYYY hh:mm:ss).

<input type="text" style="width : 80%" ng-model="startTime" ng-class="{invalid: !isValid ,valid: isValid}" />

where isValid is a scope variable which evaluates to true and false. The css class is not applied.

Here is the plnkr.

Tim Withers · Accepted Answer · 2013-09-26 18:44:07Z

5

It is working. Inspect the element. Your bootstrap classes are overwriting it. Try this:

 .invalid {
    background-color: #FA787E !important;
  }

 .valid {
    background-color: #78FA89 !important;
}

answered Sep 26, 2013 at 18:44

Tim Withers

12.1k5 gold badges45 silver badges68 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Yes. Just figured that out . The !important was important. Thanks