Unbind Ansicht Modell aus Sicht in Knockout

Ich bin auf der Suche nach unbind Funktionalität in Knockout. Leider hat das googeln und Durchsehen der Fragen, die hier gestellt wurden, keine brauchbaren Informationen zu dem Thema geliefert.Unbind Ansicht Modell aus Sicht in Knockout

Ich werde ein Beispiel geben, um zu veranschaulichen, welche Art von Funktionalität erforderlich ist.

Lets sagen, ich habe ein Formular mit mehreren Eingaben. Auch ich habe ein Ansichtsmodell, das an dieses Formular gebunden ist. Aus irgendeinem Grund als Reaktion auf Benutzeraktion muss ich mein Ansichtsmodell aus dem Formular lösen, dh da die Aktion ausgeführt wird, möchte ich alle meine Observablen auf Änderungen der entsprechenden Werte reagieren und umgekehrt - alle Änderungen an Observablen sollten nicht Auswirkungen auf die Werte der Eingänge.

Was ist der beste Weg, dies zu erreichen?

Quelle

2012-06-14 ILya

Sie können ko.cleanNode verwenden, um die Bindungen zu entfernen. Sie können dies auf bestimmte DOM-Elemente oder höhere DOM-Container anwenden (z. B. das gesamte Formular).

Siehe http://jsfiddle.net/KRyXR/157/ für ein Beispiel.

Quelle

2012-06-14 12:52:21

brilliant! Vielen Dank! – ILya

nächstes Mal schreibe getElementById und nicht $ ("# theid") [0] es ist immer noch besser, JavaScript und nicht jQuery für alles zu verwenden –

+18

Für Projekte, in denen ich jquery verwende, bin ich im Allgemeinen gerne aufgeben 1,5ms zu vermeiden zusätzliche 15 Zeichen eingeben. Ich denke, ich bleibe bei jquery selectors, wenn ich die Möglichkeit dazu habe. – Donamite

@Mark Robinson Antwort ist korrekt.

Nichtsdestotrotz, mit Mark Antwort habe ich Folgendes getan, was Sie nützlich finden können.

// get the DOM element 
    var element = $('div.searchRestults')[0]; 
    //call clean node, kind of unbind 
    ko.cleanNode(element); 
    //apply the binding again 
    ko.applyBindings(searchResultViewModel, element);

Quelle

2013-02-11 09:42:58

+1 für ko.cleanNode (Element) – lamarant

Ich musste dies nach dem manuellen Deaktivieren/Aktivieren von Formularelementen verwenden, um die automatische Knockout-'enable' Bindungen wiederherzustellen. – casey

<html> 
 
    <head> 
 
     <script type="text/javascript" src="jquery-1.11.3.js"></script> 
 
     <script type="text/javascript" src="knockout-2.2.1.js"></script> 
 
     <script type="text/javascript" src="knockout-2.2.1.debug.js"></script> 
 
     <script type="text/javascript" src="clickHandler.js"></script> 
 
    </head> 
 
    <body> 
 
     <div class="modelBody"> 
 
      <div class = 'modelData'> 
 
       <span class="nameField" data-bind="text: name"></span> 
 
       <span class="idField" data-bind="text: id"></span> 
 
       <span class="lengthField" data-bind="text: length"></span> 
 
      </div> 
 
      <button type='button' class="modelData1" data-bind="click:showModelData.bind($data, 'model1')">show Model Data1</button> 
 
      <button type='button' class="modelData2" data-bind="click:showModelData.bind($data, 'model2')">show Model Data2</button> 
 
      <button type='button' class="modelData3" data-bind="click:showModelData.bind($data, 'model3')">show Model Data3</button> 
 
     </div> 
 
    </body> 
 
</html>

@ Mark Robinson gab perfekte Lösung, habe ich ähnliches Problem mit einzelnem DOM-Elemente und andere Ansicht Modelle auf diesem einzelnen DOM-Elemente zu aktualisieren.

Jedes Ansichtsmodell verfügt über ein Klickereignis. Wenn ein Klick ausgeführt wird, wird jedes Mal, wenn ein Klick auf die Methode jedes Ansichtsmodells aufgerufen wird, eine unnötige Codeblockausführung während des Klickereignisses ausgeführt.

Ich folgte @Mark Robinson Ansatz, um den Knoten zu reinigen, bevor meine tatsächlichen Bindungen anwenden, es hat wirklich gut funktioniert. Danke Robin. Mein Beispielcode geht so.

function viewModel(name, id, length){ 
 
\t \t var self = this; 
 
\t \t self.name = name; 
 
\t \t self.id = id; 
 
\t \t self.length = length; 
 
\t } 
 
\t viewModel.prototype = { 
 
\t \t showModelData: function(data){ 
 
\t \t console.log('selected model is ' + data); 
 
\t \t if(data=='model1'){ 
 
\t \t \t ko.cleanNode(button1[0]); 
 
\t \t \t ko.applyBindings(viewModel1, button1[0]); 
 
\t \t \t console.log(viewModel1); 
 
\t \t } 
 
\t \t else if(data=='model2'){ 
 
\t \t ko.cleanNode(button1[0]); 
 
\t \t \t ko.applyBindings(viewModel3, button1[0]); 
 
\t \t \t console.log(viewModel2); 
 
\t \t } 
 
\t \t else if(data=='model3'){ 
 
\t \t ko.cleanNode(button1[0]); 
 
\t \t \t ko.applyBindings(viewModel3, button1[0]); 
 
\t \t \t console.log(viewModel3); 
 
\t \t } 
 
\t } 
 
\t } 
 
\t $(document).ready(function(){ 
 
\t \t button1 = $(".modelBody"); 
 
\t \t viewModel1 = new viewModel('TextField', '111', 32); 
 
\t \t viewModel2 = new viewModel('FloatField', '222', 64); 
 
\t \t viewModel3 = new viewModel('LongIntField', '333', 108); 
 
\t \t ko.applyBindings(viewModel1, button1[0]); 
 
\t }); 
 
\t

Quelle

2016-10-20 06:07:01

Unbind Ansicht Modell aus Sicht in Knockout

Antwort

Verwandte Themen