2013-11-23 64 views
10

在這個例子中,我有一個動態綁定輸入和div到同一個屬性。 但是在改變輸入中的文本時,更改不會反映在div元素中。動態綁定元素與applyBindingsToNode沒有響應變化

http://jsfiddle.net/rpuri/Bcps5/

ko.applyBindingsToNode(document.getElementById('input-health'), { 
    value: vm.status(), 
    valueUpdate: 'afterkeydown' 
}); 

聲明性綁定沒有我的選擇,因爲我需要綁定到局部視圖(ASP.NET MVC)共享的元素。

感謝

+0

我不明白爲什麼你需要綁定在局部視圖共享元素的事實意味着聲明綁定是不是一種選擇。你介意對此進行闡述嗎? –

+0

因爲有時在創建表單和搜索/過濾表單中使用了選擇列表和輸入字段。我在整個應用程序中共享表單作爲部分視圖。選擇列表使用緩存存儲庫在服務器端綁定。 – puri

+1

如何使用模板綁定呢? –

回答

12

您綁定到可觀察的,而不是觀察到自身的價值。

嘗試:

ko.applyBindingsToNode(document.getElementById('health'), { 
    text: vm.status, // <- not invoking status, binding to the observable itself. 
    valueUpdate: 'keydown' 
}); 

ko.applyBindingsToNode(document.getElementById('input-health'), { 
    value: vm.status, 
    valueUpdate: 'keydown' 
}); 

http://jsfiddle.net/hwQsm/

+0

太好了。但我意識到我的財產是嵌套的。那麼像這樣的工作將如何工作:value:vm.Person()。status? – puri

+1

這可能會工作,但我不能看到你的代碼不知道 - 你介意創建一個簡短的自包含代碼示例? –

+0

非常感謝! –

0

我使用的預處理功能(敲除3)。

<input type="text" data-bind="value: LastName, vuClass: 'text'" /> 

ko.bindingHandlers.vuClass = { 
    preprocess: function (value, name, addBindingCallback) { 
     if (value == "'text'") { 
      addBindingCallback('valueUpdate', "['afterkeydown', 'blur']"); 
     } 

     // ... 
     // Check other values. 
     // ... 

     return value; 
    } 
};