Ich habe also ein beobachtbares Array, das funktioniert, aber die Benutzeroberfläche wird nicht aktualisiert. Ich habe viele Leute gelesen, die auf diese Art von Problem stoßen, aber ich sehe es nicht.
Also ist das HTML
%Vor%Und das Javascript ist eine Funktion, die eine API aufruft und daraus ein Array erstellt.
%Vor%Nur zu Testzwecken verwende ich setTimeout, um den Aufruf der API erneut auszuführen und das Array zu aktualisieren. Das Array wird ordnungsgemäß aktualisiert, die Benutzeroberfläche jedoch nicht. Ich entschuldige mich für meine Ignoranz (war lange Zeit ein Backend-Entwickler, dies ist mein erster Lauf bei Javascript seit 10 Jahren). Jede Hilfe sehr geschätzt!
Das Problem besteht darin, dass Sie das observableArray nie aktualisieren.
Zunächst rufen Sie den Konstruktor erneut auf, aber der Verweis this
verweist wahrscheinlich nicht auf das Objekt, das Sie denken. Wenn Sie den Konstruktor TweetsViewModel
erneut aufrufen (im Aufruf setTimeout
), zeigt der Verweis this
auf das Objekt window
.
Selbst wenn Sie den this
Verweis auf das richtige Objekt zeigen (was möglich ist mit der apply
Methode, die Funktionen hat, aber das ist neben dem Punkt), würden Sie das observableArray immer noch nicht aktualisieren, da Sie ' d Setzen Sie die Variable self.tweets
auf ein neues ObservableArray in der Zeile
Alle Abonnements, z.B. Die UI-DOM-Elemente würden weiterhin dem alten observableArray zugeordnet, da sie nicht wissen würden, dass sich die Variable geändert hat.
Sie sollten also wahrscheinlich eine Funktion erstellen, die das erneute Laden der Daten wie folgt durchführt:
%Vor% Beachten Sie auch, dass dies dem observableArray immer Tweets hinzufügen würde (löschen Sie es nie) und es würde auch dazu führen, dass die Subskriptionen für observableArray einmal pro hinzugefügtem Tweet ausgelöst werden. Wenn Sie das Array ersetzen möchten, sollten Sie wahrscheinlich ein Ersatzarray erstellen, Tweets in dieses Array schieben und schließlich das Array im ObservableArray ersetzen, indem Sie self.tweets(replacementArray);
ausführen.
Tags und Links knockout.js javascript ko.observablearray