Angular.js: Angular 1.6 setzt `falsch zurück<select>'s `ng-model` Wert</select>

Erstellt am 20. Jan. 2017  ·  3Kommentare  ·  Quelle: angular/angular.js

Hinweis : Bei Supportfragen verwenden Sie bitte einen der folgenden Kanäle: https://github.com/angular/angular.js/blob/master/CONTRIBUTING.md#question.

Möchten Sie eine Funktion anfordern oder einen Fehler melden?
Fehler

Wie ist das aktuelle Verhalten?
Angular 1.6 setzt den <select> s ng-model , wenn sich die Liste von <option> ändert (siehe Abschnitt "Sonstige Informationen").
Angular 1.5 bewahrt es.

Wenn das aktuelle Verhalten ein Fehler ist, geben Sie bitte die Schritte zum Reproduzieren und wenn möglich eine minimale Demo des Problems über https://plnkr.co oder ähnliches an (Vorlage: http://plnkr.co/edit/tpl:yBpEi4). .
Winkel 1.6: https://plnkr.co/edit/wHc4rzy7x9PAEqQLfVQT?p=preview
Angular 1.5.11: https://plnkr.co/edit/e0LVMEtGP2j4JxNf8lsp?p=preview

Was ist das erwartete Verhalten?
ng-model bewahrt seinen Wert.

Was ist die Motivation / der Anwendungsfall für eine Verhaltensänderung?
Das ist nicht richtig.

Welche Versionen von Angular und welcher Browser / welches Betriebssystem sind von diesem Problem betroffen? Bitte testen Sie auch mit den neuesten Stable- und Snapshot-Versionen (https://code.angularjs.org/snapshot/).
Angular 1.6.x ist betroffen.
Angular 1.5.x ist nicht.

Andere Informationen (z. B. Stacktraces, verwandte Probleme, Vorschläge zur Behebung)
Die Sache ist, dass Angular 1.6 Optionen nach Modell und nicht nach dem options von

In den obigen Ausschnitten enthält das Optionsarray zwei Objekte: [{val: "1"}, {val: "2"}] .
ng-repeat durchläuft sie und verwendet die Eigenschaft val sowohl als Optionswert als auch als Titel.
vm.selected wird als ng-model -Wert von select verwendet und zunächst auf "2" gesetzt.

Nachdem ich die Taste Change options gedrückt habe, ersetze ich das Optionsarray durch dieses: [{val: "2"}, {val: "3"}] und Angular 1.6 setzt den vm.selected , sollte es aber nicht, da die Option mit dem Wert 2 ist noch in der Liste.

Angular 1.5 verhält sich in diesem Fall korrekt und der vm.selected bleibt erhalten.

Wenn vm.options primitive Werte enthält, wird kein Fehler angezeigt ( Snippet ).

forms low investigation regression bug
Quelle
picture th0r
👍7

Hilfreichster Kommentar

Es sieht so aus, als ob dies eine absichtliche Änderung in https://github.com/angular/angular.js/commit/47c15fbcc10f118170813021e8e605ffd263ad84 war : "- Wenn eine aktuell ausgewählte Option entfernt oder ihr Wert geändert wird, wird das Modell auf null gesetzt. "" Dies berücksichtigte jedoch nicht, dass dies möglicherweise nicht funktioniert oder dass ngRepeat einen Digest benötigt, um die Optionen zu aktualisieren. In ngOptions ist dies auch einfacher, da wir die Erstellung / Zerstörung von Elementen steuern.
Aber ScheduleRender () funktioniert, yay für @gkalpak ! Ich werde sehen, ob es Tests bricht und eine PR vorbereiten.

picture Narretz am 20. Jan. 2017
🎉2 👍2

Alle 3 Kommentare

Scheint ein gültiges Problem zu sein und es bricht in 1.6.0-rc.0 ein. Ich bin mir nicht sicher, warum es vorher nicht passiert ist, aber das Problem scheint folgendes zu sein:

  1. Wenn sich das Array ändert, entfernt ngRepeat die vorherigen <option> -Elemente.
  2. Dies führt dazu, dass <select> nicht ausgewählt wird und ngModel auf null gesetzt wird.
  3. Die neuen Elemente werden von ngRepeat erstellt und eingefügt, aber der modelValue ist nicht mehr 2 , sodass <select> keine Möglichkeit mehr hat, ihn mit dem neuen <option value="2" ...> zu verknüpfen.

Eine Problemumgehung besteht darin, track by zu verwenden, um zu vermeiden, dass die <option> -Elemente zerstört und neu erstellt werden:

<option ng-repeat="option in options track by option.val" value="option.val">...

#

Auf den ersten Blick sind die folgenden Commits Kandidaten dafür, dies verursacht zu haben (aber es könnte etwas anderes sein):

  • f02b707
  • 47c15fb
  • 2785ad7

#

Auf den ersten Blick würde ich diese Zeile durch scheduleRender() ersetzen und sehen, ob es hilft ...

Ich bin sicher, dass @Narretz einige bessere Einblicke haben wird: smiley:

gkalpak picture gkalpak am 20. Jan. 2017
👍2 ❤1

Eine Problemumgehung besteht darin, den Track zu verwenden, um zu vermeiden, dass der Track zerstört und neu erstellt wird

Ja, habe es auch herausgefunden, aber vergessen zu erwähnen 😏

th0r picture th0r am 20. Jan. 2017

Es sieht so aus, als ob dies eine absichtliche Änderung in https://github.com/angular/angular.js/commit/47c15fbcc10f118170813021e8e605ffd263ad84 war : "- Wenn eine aktuell ausgewählte Option entfernt oder ihr Wert geändert wird, wird das Modell auf null gesetzt. "" Dies berücksichtigte jedoch nicht, dass dies möglicherweise nicht funktioniert oder dass ngRepeat einen Digest benötigt, um die Optionen zu aktualisieren. In ngOptions ist dies auch einfacher, da wir die Erstellung / Zerstörung von Elementen steuern.
Aber ScheduleRender () funktioniert, yay für @gkalpak ! Ich werde sehen, ob es Tests bricht und eine PR vorbereiten.

Narretz picture Narretz am 20. Jan. 2017
🎉2 👍2
War diese Seite hilfreich?
0 / 5 - 0 Bewertungen

Verwandte Themen

gkalpak picture gkalpak  ·  3Kommentare
michael-letcher picture michael-letcher  ·  3Kommentare
jetta20162 picture jetta20162  ·  3Kommentare
ashish91 picture ashish91  ·  3Kommentare
awerlang picture awerlang  ·  3Kommentare