Knockout berechnet gibt Funktion erwartet Fehler in IE nur

Question

Ich bekomme ein "SCRIPT5002: Funktion erwartet", die nur in IE passiert. Ich teste gerade gegen Version 9. Es passiert, wenn ich ein zuvor definiertes berechnetes Observable innerhalb eines anderen berechneten Observablen verwende.

Meine Anwendung ist ein bisschen komplexer als das, also habe ich den Fehler mit dem viel einfacheren Code unten reproduziert. Der Fehler tritt in der Zeile z = self.subtotal(); auf, wenn Sie eine Nummer für Nummer 1, Nummer 2 und Nummer 3 (und Tabulator) eingeben.

Dieser Fehler tritt nicht in Chrome oder Firefox auf und ich habe seit einiger Zeit gegoogelt. Hoffentlich kann mir jemand helfen, mich zu entsichern. Hier

ist der Link zum jsfiddle: http://jsfiddle.net/kCmTg/

Hier wird das javascript:

function putVars() { 
    self = this; 
    self.number1 = ko.observable(); 
    self.number2 = ko.observable(); 
    self.subtotal = ko.computed(function() { 
     return parseFloat(self.number1()) + parseFloat(self.number2()); 
    }, self, { deferEvaluation: true }); 

    self.number3 = ko.observable(); 
    self.number4 = ko.observable(); 
    self.total = ko.computed(function() { 
     var x, y, z; 
     x = self.number3(); 
     y = self.number4(); 
     z = self.subtotal(); 
     return parseFloat(x) + parseFloat(y) + parseFloat(z); 
    }, self, { deferEvaluation: true }); 
} 

$(function() { 
    ko.applyBindings(new putVars()); 
}); 

Hier ist der HTML:

<h4>Calc 1</h4> 
<label for="Number1">Number 1: </label><input id="Number1" type="text" data-bind="value: number1" /> 
<label for="Number2">Number 2: </label><input id="Number2" type="text" data-bind="value: number2" /> 
<label for="Subtotal"><b>Subtotal: </b></label><input id="Subtotal" type="text" data-bind="value: subtotal" readonly="readonly" /> 
<hr /> 
<h4>Calc 2</h4> 
<label for="Number3">Number 3: </label><input id="Number3" type="text" data-bind="value: number3" /> 
<label for="Number4">Number 4: </label><input id="Number4" type="text" data-bind="value: number4" /> 
<label for="Total"><b>Total:</b> </label><input id="Total" type="text" readonly="readonly" data-bind="value: total" /> 

Answer 1

Dies hat eine ähnliche Ursache zu diesem: knockout.js Computed observable called twice in Internet Explorer und wird durch die Tatsache verursacht, dass in IE < 10 Knockout einen speziellen Code hat, um mit einem Autocomplete-Wert aus dem Feld zu bekommen. Dies geschieht auch dann, wenn das Feld wie in Ihrem Fall schreibgeschützt ist. Es überprüft jedoch das Attribut autocomplete. So könnte man es, wie dieses Problem zu beheben:

<input id="Subtotal" type="text" data-bind="value: subtotal" autocomplete="off" readonly="readonly" /> 

Es gibt auch hier ein bug in Knockout im Spiel ist -, dass es eine berechnete beobachtbar zu einem Zwei-Wege-Bindung bestanden überschreibt. Dies ist bereits in der Entwicklungsversion von Knockout behoben, die als Version 2.3.0 (voraussichtlich im April 2013) erscheinen soll. Um dies zu umgehen, können Sie den Wert der beobachtbaren die Bindung statt der berechneten beobachtbaren selbst, wie dies passieren:

<input id="Subtotal" type="text" data-bind="value: subtotal()" readonly="readonly" /> 

Answer 2

Es scheint, dass Sie einen Fehler entdeckt haben, in IE oder KnockoutJS, die wahrscheinlich von Knockouts Bindings exponiert wurden, wobei Knockout einen Wert in eine Observable drängt, aber in IE9 überschreibt es die Eigenschaft.

Dies tritt bei IE10 nicht auf, was darauf hindeutet, dass es sich um einen Fehler in IE9 handelt. Ich würde vermuten, Knockout hat etwas, wo es überprüft, ob ein Wert ist eine beschreibbare beobachtbare Funktion und es wird falsch auf IE9 gemeldet.

Interessanterweise, wenn Sie KO ein Lese-/Schreib zu verwenden, berechnet ändern, wird der Fehler nicht mehr:

self.subtotal = ko.computed({ 
    read: function() { 
     return parseFloat(this.number1()) + parseFloat(this.number2()); 
    }, 
    write: function(val) { } 
}, self); 

Vielleicht, dass eine ausreichende Behelfslösung ist?

Answer 3

Bitte überprüfen Sie, ob Sie einen Wert übergeben werden als Parameter beobachtbar sind oder nicht . Zum Beispiel budgetlineviewmodel.total = gesamt (5). Ich habe versucht, budgetlineviewmodel.total = 5. aber ohne Erfolg.

Knockout Observables sind nichts anderes als Funktionen intern und müssen Sie einen Wert in Klammern übergeben, die intern den gleichen Wert zurückgeben.

Chrome ist nachsichtig und erlaubt es, dass budgetlineviewmodel.total() Nullwerte toleriert, wenn kein Parameter übergeben wird.

hoffe das hilft.

Prost!

budgetlineviewmodel.Save = function() {   
     var currentTotalAmt = $('#txtTotal').val(); 
     budgetLineViewModel.Total(currentTotalAmt); 
}