ng-switch und ng-repeat auf dem gleichen Element interfearing

Ich begegnete Verhalten in Angular Ich habe nicht erwartet und der Zweck dieses Beitrags ist herauszufinden, ob dies ein Fehler oder beabsichtigt und möglicherweise eine Erklärung, warum es beabsichtigt ist.ng-switch und ng-repeat auf dem gleichen Element interfearing

Zuerst siehe diese Plunkr: http://plnkr.co/edit/CB7k9r?p=preview. Im Beispiel habe ich ein Array namens array mit drei Objekteinträgen erstellt. Weiter habe ich einen ng-switch basierend auf dem Inhalt eines Eingabefeldes (Toggle genannt) erstellt. Wenn der Wert von toggle 1 ist, sollten alle Namen der Objekte in dem Array mit dem Präfix "1" und ansonsten mit dem Präfix "other" gedruckt werden.

Diese wie beabsichtigt funktioniert nicht ein einen Fehler zeigt:

Error: Argument '?' is required at assertArg

jedoch das gleiche Beispiel neu geschrieben (http://plnkr.co/edit/68Mfux?p=preview) mit einem extra div um die Liste, bewegten die ng-Schalter auf diese div und ng -switch-wenn von der li in die ul bewegt (trennt die ng-repeat und die ng-switch-when) funktioniert wie beabsichtigt.

Könnte jemand erklären, warum das so ist?

Quelle

2013-03-15 Kevin

Die Struktur der beiden Plunkrs scheint genau gleich zu sein, abgesehen von den Namen, die von Array zu Streams wechseln. Bist du sicher, dass du keinen Fehler gemacht hast? –

Während es durchaus möglich ist, habe ich einen Fehler gemacht, der erste Plunker ist fehlerhaft, während der zweite nicht ist. Ich verstehe nicht, was mit dem ersten falsch ist. – Kevin

Ah, danke für das Heads-up. Ich muss einen Fehler beim Speichern gemacht haben. Es ist jetzt behoben http://plnr.co/edit/CB7k9r?p=preview funktioniert nicht http://plnkr.co/edit/68Mfux?p=preview tut. (und ich verstehe jetzt Tiago meinte das gleiche, sorry) – Kevin

Es ist "absichtlich", da es ein Produkt davon ist, wie angular handles ng-repeat. Im Wesentlichen werden mehrere Kopien des Markups geklont (das Markup innerhalb von ng-repeat wird als Vorlage verwendet) und für jedes Element, das Sie iterieren, einzeln kompiliert. Als solches wird eckig im Grunde 3 <li ng-switch-when='1' ....> und 3 <li ng-switch-default ....> kompiliert, aber dies geschieht außerhalb des Kontextes - es gibt kein ng-Einschaltelement zum Vergleich.

können Sie dies sehen, durch die sich ergebende Auszeichnungs Inspektion:

<ul ng-switch="" on="toggle"> 
    <!-- ngRepeat: entry in array --> 
    <!-- ngSwitchWhen: 1 --> 
    <!-- ngSwitchWhen: 1 --> 
    <!-- ngSwitchWhen: 1 --> 
    <!-- ngRepeat: entry in array --> 
    <!-- ngSwitchDefault: --> 
    <!-- ngSwitchDefault: --> 
    <!-- ngSwitchDefault: -->   
</ul>

Beide Richtlinien - ng-repeat und ng-Schalter - mit Vorsicht behandelt werden sollten, da sie (im Gegensatz zum Beispiel ng-Show oder ng-hide) beeinflussen die Struktur stark. Der zweite (funktionierende) Plunker ist der Weg zu gehen - arbeite nur mit Direktiven AFTER (strukturell, INSIDE) die ng-switch-Logik.

Quelle

2013-03-15 13:46:55

ng-switch und ng-repeat auf dem gleichen Element interfearing

Antwort

Verwandte Themen