Add a class to the html element using angular js dynamically on the basis of If condition

Question

I am implementing some default styles for a div for a "condition id" as (id="default")

<div id="student" class="student"> /* if(id == "default") */

I need to set some other styles (class="changeStyle"), if the "condition id" is changed i.e. (id != "default")

<div id="student" class="changeStyle"> /*if(id != "default") */

which should be added dynamically, if it's finding the (id != "default").

Any suggesstion/example would be highly appreciated.

score 3 · Accepted Answer · answered Aug 19 '14 at 08:17

You can use ngClass

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.

Example: Here assuming ID is a variable in scope

<div 
  ng-class="{'changeStyle': id != 'default',  'student': id == 'default'}">

Add a class to the html element using angular js dynamically on the basis of If condition

1 Answers1