爲什麼不是我的動態按鈕禁用knockoutjs？

Question

我不確定爲什麼我的動態按鈕沒有使用knockoutjs禁用？

原工作動態HTML和knockoutjs：Link1
工作正在進行中：Link2

var viewModel = { 
    first: ko.observable("Bob"), 
    last: ko.observable("Smith"), 
    isEnabled: ko.observable("disabled") 
}; 

viewModel.fullName = ko.dependentObservable(function() { 
    return this.first() + " " + this.last(); 
}, viewModel); 

function addDynamicContent() { 
    $("#main").append("<div id='dynamic' data-bind='text: fullName'></div><input id='Button1' type='button' value='Hello World' data-bind='disabled=isEnabled' />"); 

    ko.applyBindings(viewModel, $("#dynamic")[0]); 
} 

ko.applyBindings(viewModel); 

Answer 1

的禁用綁定您的數據綁定語法是在你的附加HTML不正確的，你的補辦綁定並不完全正確。

更改您的啓用/禁用可觀察到使用一個布爾值

isEnabled: ko.observable("disabled") 

應該是：

isEnabled: ko.observable(true) 

糾正你的附加標記中的禁用數據綁定語法

$("#main").append("<div id='dynamic' data-bind='text: fullName'></div><input id='Button1' type='button' value='Hello World' data-bind='disabled=isEnabled' />"); 

應該是：

$("#main").append("<div id='dynamic' data-bind='text: fullName'></div><input id='Button1' type='button' value='Hello World' data-bind='disable: isEnabled' />"); 

更改綁定更新整個視圖模型

ko.applyBindings(viewModel, $("#dynamic")[0]); 

應該重新綁定：

ko.cleanNode($("#main")[0]); 
ko.applyBindings(viewModel); 

Updated JSFiddle。

這將使您的示例功能，但是如果您正在處理動態內容，我強烈建議使用一些額外的綁定，而不是每次都附加HTML和重新綁定您的綁定。看看Observable arrays，template binding和working with collections。

我把另一個JS Fiddle example放在一起，它顯示了使用上述綁定的動態內容和綁定的另一種方法。