Using class with angular vs ng-class while using a mixed expression

Question

I have a div that I want to give a dynamic class with AngularJS.

The div is withing an ng-repeat statement where lang.prefix is first en then sv

Using the fo

Answer 1

The book you have mentioned may have talked about the problems of using ng-class and class {{}} interpolations together wherein updates in the interpolation removes the ng-class classes, this problem has already been resolved, reference. Thus, using interpolation within class attributes is totally fine, and does not break good practice because both has its own quirks.

Your usage of ng-class however is incorrect, you have to concatenate the literal string value with your scope string variable:

<div class="float-left flag" ng-class="'i-flag-' + lang.prefix"></div>

but I think it is much preferable to use your first example instead:

<div class="float-left flag i-flag-{{lang.prefix}}"></div>