dedlfix: AngularJS ng-class

Beitrag lesen

Tach!

Ich hab mein Beispiel modifiziert.

Ich kann nicht erkennen, wo der Unterschied liegt. Alles ist so wie in meiner Erinnerung.

Was ich haben möchte ist, wenn man die Checkbox selektiert, dass NUR die grünen Balken erscheinen und den roten Balken die Klasse ... padding zugewiesen wird, dass diese nicht sichtbar sind.

Ich hab da mal dran rumgefiddelt und so sollte es nun das sein, was du wolltest. Zudem hab ich aufgeräumt. Die Logik kann man zwar in ng-class unterbringen, sollte man aber nicht. Ich hab stattdessen einen $watch auf den Checkbox-Wert gesetzt. (Beachte auch das Objekt settings statt des primitiven Wertes. (Ob der Name passend ist, musst du entscheiden.))

Ein input braucht gar nicht so viele Attribute, wenn es nur mit Angular arbeiten soll, type und ng-model und gut ist. Statt $watch wäre auch ein ng-change im input möglich, aber dann fehlt die initiale Abarbeitung der Funktion, die jetzt im $watch steckt. Diese Funktion erweitert das Model um eine Eigenschaft. Wenn das anderenorts stört, solltest du aus deinem Model ein separates Viewmodel zum Zwecke der Darstellung erstellen. Die Erzeugung des Models sollte auch besser in einen Service ausgelagert werden. Es ist nicht Aufgabe der Controller, die Daten zu erzeugen. Für das Beispiel mag das gehen, aber besonders elegant ist das nicht. Zudem kann man das Array auch direkt notieren und muss nicht es nicht mit einem Haufen Zwischenvariablen und Push-Aufrufen erstellen. Man kann class und ng-class mixen. Was unveränderlich ist, kann direkt in class stehen. Dann liegt da noch eine Funktion $scope.switchViewType rum, die ist ohne Funktion und kann vermutlich weg. Warum die Progress-Bar entsprechend der Datenanzahl wiederholt wurde, erschloss sich mir nicht. Ich hab das ng-repeat an der Stelle entfernt, weil es mir unsinnig erschien. Weiterhin hab ich den Code etwas mehr JSFiddle-gerecht umverteilt und vereinfacht.

dedlfix.