2014-04-24 14 views
5

Ich baue gerade eine Nummer schwere App in Knockout. In meiner App gibt es drei Arten von Zahlen: Prozentangaben, Dezimalzahlen und große Zahlen und ich habe benutzerdefinierte Bindung Handler für jeden Typ.Knockout teilen einen Bindungshandler

Für die Eingaben habe ich auch eine Nummer Validierung bindingHandler erstellt, die jeden Tastendruck liest, um sicherzustellen, dass es sich um eine Eingabe handelt. (In der App gibt es Flashy Border CSS-Animationen und solche Sachen - das ist nur ein leeres Beispiel).

Nun, da die Eingaben die Validierungsprüfungen und die Zahlenformatierung ausführen, musste ich die Variable zweimal binden, wie Sie unten in der Geige sehen können.

<input data-bind="number: testdata, percentage: testdata"> 

Ich denke, dass dies unnötig meinen HTML-Markup ist Blähungen und es muss ein aufgeräumter Weg, um beiden Handler gleichzeitig auslösen.

Meine Frage: Ist es möglich, das Nummernüberprüfungsskript als eine Funktion zu erstellen, die dann innerhalb der Zahlformatierungshandler geteilt/eingeschlossen werden kann; ohne mein Javascript aufzublähen?

Ich bin immer noch relativ neu bei Knockout, so dass ich immer noch unsicher bin.

See Fiddle: http://jsfiddle.net/axV6S/1/

Antwort

2

Ja, Sie können einfach die Nummer init in seine eigene Funktion extrahieren, dh das ändern:

ko.bindingHandlers.number = { 
    init: function (element) { 
     /* ... */ 
    } 
}; 

in diese:

var numberInit = function(element) { 
    /* ... */ 
}; 

Just Call es von Ihrem anderen init wie folgt:

init: function(element, valueAccessor) { 
    numberInit(element); 
    /* ... */ 
} 

oder wenn Sie das richtige ‚this‘ Kontext behalten möchten:

init: function(element, valueAccessor) { 
    numberInit.apply(this,arguments); 
    /* ... */ 
} 
0

Sie sind viel gebaut in der Funktionalität innerhalb Knockout zu duplizieren. Beim Erstellen Ihres Ansichtsmodells können Sie Einschränkungen für Ihre Modelleigenschaften definieren. Sie können für eine Vielzahl von numerischen Daten tun:

this.FieldName = ko.observable().extend({ pattern: regex }); 

Dies wird Ihre Textfelder beschränken, nd Sie müssen nicht für Drücken von Tasten zu hören, und Maßnahmen zu ergreifen. Knockout macht das im Hintergrund für dich!

Werfen Sie einen Blick auf diesem für weitere Beispiele: http://mikedormitorio.azurewebsites.net/BlogPost/the-native-validation-rules-of-knockout-validation

Dies ist auch eine hilfreiche Lese: http://knockoutjs.com/documentation/extenders.html

+1

Bitte beachten Sie, dass dies stützt sich auf [Knockout-Validierung] (https://github.com/Knockout -Kontrib/Knockout-Validierung), die eine externe Bibliothek und nicht Teil von Knockout Core ist. – janfoeh

Verwandte Themen