Recently I had this requirement that the pages of an admin panel should be dynamically segregated based on the type of user logged in. I managed to implement it, but had difficulty in setting appropriate styles, like font awesome icons. I searched Google but didn't find the answer what I was looking for.
<li ng-class="pageType=='cart'?'fa fa-shopping-cart':'fa fa-barcode'"></li>
<li class="{{pageType=='cart'?'fa fa-shopping-cart':'fa fa-barcode'}}"></li>
FYI I am using angular js and wanted to do solve this in angular js only. So I found ng-class directive.
To assign class based on a condition just use ng-class directive like below.
ng-class ="yourCondition?'ClassTrue':'ClassFalse'
An example is given below
<li ng-class="pageType=='cart'?'fa fa-shopping-cart':'fa fa-barcode'"></li>
This can also be done using class attribute like below
<li class="{{pageType=='cart'?'fa fa-shopping-cart':'fa fa-barcode'}}"></li>
That's it. Simple isn't it?
Comments
Post a Comment