angular js ng class example

If you study the inbuilt direcctive in angular js then ngClass is also a very useful directive. This ngClass directive allow you to add or remove classes on a html element. In Html page this ngClass use as ng-class. Syntax of this class is very smiple and its easy to use. It can be easily understand by a example suppose we have a three checkbox and in just below there are div container these checkbox have three different color type one is red second is blue and last one is green, when we click on red then div color will be red and so on. So we can do this easily by class in angular js. Yeah offcourse you can do this by another way also
Here we check it out about following angular ng class example.
1. Angular ng class with normal string syntax.
2. Angular js conditional class.
3. Angular js conditional class with ternary operator.

Angular JS ng class example

<!DOCTYPE html>

<html>

<style>

.red

{

background-color: red;

}

.blue

{

background-color: blue;

}

.green

{

background-color: green;

}

</style>

<p>Choose a class:</p>

<option value="">select</option>

<option value="green">Green</option>

</select>

<h3>Anguar JS ng class </h3>

</div>

</body>

</html>

Output of ng-class

Choose a class:

Anguar JS ng class

Angular js conditional class example

Now we try to do this same example with conditional class . In this you can set condition and also assign conditional class.