evento knockout.js che tiene traccia di ogni cambio di testo all'interno di una casella di testo di input

Question

Sono nuovo di knockout js. Voglio chiamare una funzione ogni volta che un testo cambia all'interno di una casella di testo. Ho ricercato abit e implementato keyup, keydown e keypress ma non hanno funzionato correttamente. Se qualcuno mi può dare una soluzione o ti preghiamo di reindirizzare a un documento che è utile per il mio scenario. E se ci fosse una sorta di documentazione su tutti gli eventi (integrati e personalizzati) disponibili in knockout Js, sarebbe davvero utile.

per essere precisi in merito al problema:

data-bind="value: targetProp, event:{keyup: $parent.changeProp}" 

E in Js:

Inside parent: 
    this.changeProp = function() { 
       if (condition..) { 
         do something... 
       } 
      } 

Non funziona con il tasto su. Per una soluzione semplice, per favore dammi qualcosa che avvisi la lunghezza della stringa che è stata scritta all'interno di una casella di testo (su ogni testo inserito ed eliminato). Grazie in anticipo.

Answer 1

È anche possibile iscriversi alle modifiche manualmente.

Assicurarsi che il targetProp è osservabile, e quando si costruisce il genitore, iscriviti manualmente le modifiche:

parent.targetProp = ko.observable(originalValue); 

parent.targetProp.subscribe(function(newValue) { 
    alert("The new value is " + newValue); 
}); 

---

Edit: per un'opzione di rilegatura:

<select data-bind="options: myObservableArray, value: selectedValue"></select> 

in js :

self.selectedValue = ko.observable(); 

poi:

self.selectedValue.subscribe(function(newValue) { 
    alert("The new value is " + newValue); 
}); 

Answer 2

È possibile utilizzare valueUpdate: 'afterkeydown' che aggiorna il modello di visualizzazione non appena l'utente inizia a digitare un carattere.

data-bind="value: targetProp, valueUpdate: 'afterkeydown'" 

Answer 3

Oppure si può utilizzare textInput vincolante dall'ultimo KO 3,2

<input data-bind="textInput: userName" />

Oltre aggiornamenti in tempo reale, si gestisce correttamente taglia/incolla, trascinamento, completamento automatico.

Answer 4

Se si desidera calcolare in tempo reale, come la persona sta digitando, è possibile farlo.

HTML

<input type="text" id="description" class="form-control" maxlength="255" 
data-bind="value:description, event:{keyup:calcDescriptionCount}"> 
<br> 
<span data-bind="text:descriptionCount"></span> charactors left. 

ViewModel JS

self.description = ko.observable(""); 
self.descriptionCount = ko.observable(255); 
self.calcDescriptionCount = function(){ 
    this.descriptionCount(255 - $("#description").val().length); 
};