Comment forcer une actualisation de vue sans qu'elle se déclenche automatiquement à partir d'un observable?

151

Remarque: ceci est principalement destiné au débogage et à la compréhension de KnockoutJS.

Existe-t-il un moyen de demander explicitement à Knockout d'actualiser la vue à partir du modèle de vue (déjà lié)? Je recherche quelque chose comme:

ko.refreshView();

Je comprends que ce n'est pas une utilisation prévue de Knockout, mais je veux toujours savoir s'il existe une telle méthode à des fins de débogage et d'apprentissage.

THX-1138
la source

Réponses:

252

Vous ne pouvez pas appeler quelque chose sur l'ensemble de viewModel, mais sur un observable individuel, vous pouvez appeler myObservable.valueHasMutated()pour informer les abonnés qu'ils doivent réévaluer. Ce n'est généralement pas nécessaire dans KO, comme vous l'avez mentionné.

RP Niemeyer
la source
5
Vous pouvez également parcourir le contexte des données, en recherchant des éléments qui ont une valueHasMutatedpropriété de type functionet en l'appelant pour chacun d'eux. Cela devrait obtenir tous vos observables, mais c'est une mauvaise pratique et peut-être déclencher beaucoup plus de mises à jour que vous ne le pensez (pensez aux chaînes de dépendances calculées).
Patrick M
Ce serait bien si pour rien d'autre - des tests dans Chrome.
Scott Romack
Votre viewModel peut lui-même être un observable, vous pouvez donc appeler myViewModel.valueHasMutated()pour mettre à jour la vue entière.
Roy J
2
Ne fonctionne pas non plus sur les tableaux ici. En fait, les tableaux ne semblent pas du tout fonctionner dans Knockout. Angular me manque :-(
garryp
2
Cela fonctionne sur KnockoutObservableArrays à partir de KO 3.5
balint
25

Dans certaines circonstances, il peut être utile de simplement supprimer les liaisons, puis de les réappliquer:

ko.cleanNode(document.getElementById(element_id))
ko.applyBindings(viewModel, document.getElementById(element_id))
ProfNimrod
la source
Merci pour l'édition ebram ... Je suppose que j'aurais dû mentionner que j'utilise coffeescript ;-)
ProfNimrod
15
Faites attention si vous utilisez également jQuery (par exemple lors de la migration de bits de l'application vers ko) car cleanNode supprimera également d'autres événements dom.
Dan Revell
C'est parfait. Je ne peux pas faire en sorte que KO reconnaisse les NOUVEAUX enfants dom avec des attributs de liaison de données après l'application d'un modèle de vue.
Andrew T Finnell
Parfait! Travail!
jeff_drumgod
0

J'ai créé un JSFiddle avec mon gestionnaire de liaison knockout bindHTML ici: https://jsfiddle.net/glaivier/9859uq8t/

Tout d'abord, enregistrez le gestionnaire de liaison dans son propre fichier (ou dans un fichier commun) et incluez-le après Knockout.

Si vous utilisez ce changement vos liaisons à ceci:

<div data-bind="bindHTML: htmlValue"></div>

OR

<!-- ko bindHTML: htmlValue --><!-- /ko -->
James Burton 'Fluffy'
la source