Warum wird das Objekt, das ich zu meinem ngModel hinzufüge, als nicht definiert angezeigt, wenn es durch console.log weitergeleitet wird?

Question

Ich habe zwei Anweisungen in meiner eckigen App.

Richtlinie 1 hat ein ngModel, das ein Array von Objekten ist. Durch die Direktiven-Methoden schiebe ich ein Objekt an das Ende des Arrays.

So ist zum Beispiel das ursprüngliche ngModel-Array [1,2,3,4], und ich füge 5 hinzu, so dass das Array wie [1,2,3,4,5] aussieht.

Dieses ngModel wird als ngModel an meine zweite Anweisung übergeben. Ich kann console.log das Array und alle 5 Elemente sehen, aber wenn ich versuche, auf das letzte Element zuzugreifen, das Element, das ich hinzugefügt habe, wird es nicht angezeigt. Zum Beispiel, wenn ich eine foreach für das Array mache, ist es so, als ob das letzte Element nicht existiert.

Ich kann nicht das Element zugreifen. Irgendjemand hat irgendwelche Ideen warum?

Danke!

Answer 1

Ich nehme an, Sie verwenden, um die Funktion link das fünfte Element in Ihrer Mutter Richtlinie hinzuzufügen.

Es gibt zwei Arten von link Funktionen: pre und post Link. Nehmen wir an, Sie haben parent und verschachtelte child Direktive. Die Link-Funktionen werden in dieser Reihenfolge aufgerufen werden:

• Eltern Pre-Link
• Kind pre-Link
• Kind post-Link
• Mutter post-Link

von Standard, wenn Sie link in Ihrer Direktiven Objektnotation verwenden, wird es die Post-Link-Funktion sein.

return { 
    link: function (scope, element, attrs) { } 
} 

Und wenn Sie Ihr fünftes Element in dem übergeordneten Post Link hinzufügen, dann wird es nicht für das Kind zur Verfügung stehen, da sie hinzugefügt werden, nachdem das Kind Link aufgerufen wurde. Die Art und Weise, dem Kind korrekt initialisierte Daten zu geben, ist entweder Pre-Link oder Controller zu verwenden (aber letzteres ist hier nicht möglich).

return { 
    link: { 
     pre: function (scope, element, attrs) { } 
    } 
} 

Hier ist ein funktionierendes plnkr mit Ihrem Beispiel: http://plnkr.co/edit/24KrGLdnkDCrLr2SzXhQ?p=preview