Vorlage:Der Ausdruck hat sich nach der Überprüfung geändert. Angular 2 Ausgabe
<tbody>
<tr>
<td>{{getRand()}}</td>
<td>{{getRand()}}</td>
</tr>
</tbody>
Methode:
getRand(){
return Math.floor(Math.random()*100);
}
Fehler:
Expression has changed after it was checked. Previous value: '90'. Current value: '32'.
Kann mir jemand erklären, warum dieser Fehler auftritt? Warum kann ich diese Methode nicht mehrmals aufrufen?
So funktioniert die Erkennung der Winkeländerung!
Der Änderungsdetektionsalgorithmus in Angular durchläuft den Komponentenbaum zu bestimmten Zeiten (einige Ereignisse), um festzustellen, was sich geändert hat.
Anschließend wird die Benutzeroberfläche basierend auf den Modelländerungen und Benutzeroberflächenbindungen aktualisiert.
Im Dev-Modus (siehe https://angular.io/docs/ts/latest/api/core/index/enableProdMode-function.html und what exactly happens when `enableProdMode()` und What is difference between production and development mode in Angular2?) wird diese Komponente zweimal ausgeführt, um sicherzustellen, dass das Modell nach den Änderungen stabil ist. In Ihrem Fall ist die Funktion, die Sie für die Bindung verwenden, nicht frei von Nebenwirkungen, da jeder Aufruf der Funktion einen anderen Wert zurückgibt.
Als Faustregel gilt, dass side-effect-freie Bindungen verwendet werden.
Ah ich sehe. Wie würde ich Zufallszahlen für ein Array unbestimmter Länge produzieren, ohne Nebenwirkungen auszulösen? – userqwert
Das macht nichts als solches kaputt. Aber angenommen, Sie möchten, dass diese Zufallszahl nur einmal generiert wird, wäre es besser, wenn Sie dies in der Steuerung in einer Art Array tun und dann an das Array binden. – Chandermani
Haben Sie Server-Side-Rendering eingeschaltet?
Nicht sicher über angular, aber auf React, wenn Sie serverseitige Rendering haben, werden die gerenderten Werte auf der Clientseite neu ausgewertet und es werden einige Fehler/Warnungen darüber ausgelöst.
Nah ist alles Frontend mit angular-cli. Ich nehme an, dass der Digest-Zyklus bemerkt, dass er sich verändert hat und denkt, dass es aus irgendeinem Grund ein Fehler ist. – userqwert
Haben Sie Server-Side-Rendering? Das könnte die Ursache sein – Hasan