Verwenden der Klasse mit eckiger vs ng-Klasse bei Verwendung eines gemischten Ausdrucks

Ich habe ein div, dass ich möchte eine dynamische Klasse mit AngularJS.

Das div-Element innerhalb eines ng-repeat-Anweisung, wo lang.Präfix ist die erste en dann sv

Mit dem folgenden code funktioniert und setzt den Klasse i-flag-en als i-flag-sv, aber ist es richtig?

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

Ich weiß, es gibt eine ng-Klasse Richtlinie kann verwendet werden, um dynamisch setzen Sie die Klasse eines Elements mit AngularJS.

Ich glaube, ich habe irgendwo gelesen, in einem Buch, dass die normale Klasse-Richtlinie sollte nicht verwendet werden, um die class-Eigenschaft dynamisch mit AngularJS, weil der Weg Winkel manipuliert das dom.

Aber der folgende code funktioniert nicht:

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

und ich will lieber stellen Sie die Klasse auf diese Weise anstatt einer anderen scope-variable.

Ist es schlechte Praxis, um die Verwendung des class-Attributs mit AngularJS dynamisch setzen Sie die Klasse? Funktioniert es die ganze Zeit, auch wenn es schlechte Praxis?

Kommentar zu dem Problem
Ok das ist aus meiner Erfahrung, ich bin nicht allzu informiert über das Innenleben der kantige DOM-manipulation. Ich bin mir nicht sicher, es gilt als schlechte Praxis zu verwenden class={{}}, ich benutze es eine Menge und haben es nicht gefunden, verursachen bei mir keine Probleme (bisher). Verwenden Sie ng-class, wenn Sie möchten, legen Sie eine Klasse bedingt, oder wenn Sie erwarten, dass die Klasse zu ändern, verwenden Sie class="{{}}", wenn Sie möchten, um dynamisch die Klassen und nicht erwarten, dass der resultierende Ausdruck in die Klasse zu ändern. Zum Beispiel, um einen string zurückzugeben, der die Klassen aus einer Funktion: class={{generateClassBasedOnProductType()}}. Kommentarautor: Mohammad Sepahvand

InformationsquelleAutor der Frage user264230 | 2014-08-01

  1. 21

    Dem Buch, das Sie erwähnt haben, haben können, und Sprach über die Probleme der Verwendung von ng-class und Klasse {{}} Interpolationen zusammen, wobei Aktualisierungen in der interpolation entfernt die ng-class Klassen, die dieses problem schon behoben wurde, "Referenz. So verwenden interpolation innerhalb der Klasse Attribute ist völlig in Ordnung und nicht brechen gute Praxis, denn beides hat seine eigenen Macken.

    Ihre Verwendung von ng-Klasse ist jedoch falsch sind, müssen Sie zum verketten von literaler string-Wert mit Ihrem Umfang ist die string-variable:

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

    aber ich denke, es ist viel besser, Ihr erstes Beispiel statt:

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

    InformationsquelleAutor der Antwort ryeballar

Schreibe einen Kommentar