淘汰赛 - 无法处理绑定 - 随着

Question

我还是相当新KnockoutJS，我有一个结合的问题，不能看到什么是错的。我尝试了各种各样的东西，但似乎没有任何工作。我相信可能有一个简单的解决方案，我只是看不到它！

我打电话通过AJAX数据，并试图从文本框中的数据，然后可以进行更新显示一个项目。我收到以下错误控制台：

Uncaught ReferenceError: Unable to process binding "with: function (){return KHAViewModel }" Message: Unable to process binding "with: function(){return fundedWTEResults }" Message: Unable to process binding "textInput: function(){return ActualFundedWTE }" Message: ActualFundedWTE is not defined

下面是我的代码缩减版本，我已经复制我的一些JS AJAX脚本。我也复制它jsFiddle：

HTML

<div class="container"> 
    <pre data-bind="text: ko.toJSON($data, null, 2)"></pre> 
</div> 

<div class="container" id="dateSearch" > 
    <h2></h2> 
    <form class="form-inline" data-bind="with: KHAViewModel"> 
    <div class="form-group" data-bind="with: fundedWTEResults"> 
     <span>Funded WTE: </span> 
     <input id="fundedWTE" data-bind="textInput: ActualFundedWTE"> 
    </div> 
    </form> 
</div> 

JS

// KHA View Model 
function KHAViewModel() { 
    var self = this; 
    self.fundedWTEResults = ko.observableArray([]); 

    function fundedWTE (team) { 
    // $.ajax({ 
    // url: "/...", 
    // type: "POST", 
    //  ........... 
    // }); 

    var r = [{"Team":team,"ActualFundedWTE":12.00}]; 
    ko.mapping.fromJS(r, {}, self.fundedWTEResults); 
    } 

    fundedWTE('TeamA'); 

} 

// Master View Model 
function masterVM() { 
    var self = this; 
    self.KHAViewModel = new KHAViewModel(); 

}; 

// Activate Knockout 
ko.applyBindings(new masterVM()); 

Answer 1

感谢@ user3297291指出了有目共睹的问题。

我使用的with:绑定创建了一个新的binding context，以便后代元素绑定在指定对象的上下文中。所以我的数组仍然是一个对象，因此Array中的对象不能以所需的方式访问。

要使用的正确绑定是foreach:绑定，foreach绑定会为数组中的每个条目复制一段标记，并将该标记的每个副本绑定到相应的数组项。因此允许我在数组中的每个对象内显示各个值。

也感谢@克里斯共享一个伟大的方式来调试这些类型的使用ko.dataFor()代码在未来的问题。

Answer 2

它看起来像@ user3297291已经解决您的问题具有显着的活泼。

一个提示调试这些类型的问题时，这将有助于你在今后的使用ko.dataFor和ko.contextFor。特别是如果您使用Chrome，则在控制台$ 0引用开发人员工具中当前选定的元素。

选择要进行调查，并在开发者控制台类型元素：

ko.dataFor($0) 
ko.dataFor(document.getElementById("fundedWTE")) //Equivalent to this 

它会显示该元素被绑定怎么这通常是足以帮助你让你的头周围什么绑定上下文实际上是。

ko.contextFor为您提供了更多的信息，方便的，如果你有$根$父母，父母$等打