更新元素時​​更新模型更新時使用淘汰賽自定義綁定

Question

我正在做一個jQuery自動完成與knockout.js接線的練習。我正在嘗試構建的應用程序是一個簡單的待辦任務列表。我的任務對象具有desc,name和id等屬性。它有一個方法setUser()它設置任務名稱& ID（基本分配任務給某人

，我寫我的自定義綁定這樣說：

ko.bindingHandlers.autocomplete = { 
    init: function (el, valueAccessor) { 
     var va = valueAccessor(); 
     var lbl = va.label; 
     var val = va.value; 
     $(el).autocomplete({ 
      source: src, 
      select: function (evt, ui) { 
       evt.preventDefault(); 
       lbl(ui.item.label); 
       val(ui.item.value); 
       $(el).val(ui.item.label); 
      } 
     }); 
    } 
}; 

的data-bind語法寫成如下：

<input type="text" data-bind="autocomplete : {label: name, value: id}"/> 

所有這一切都很好地完美地連接了自動完成，但是，如果您改變模型中的某些內容，您自然希望關聯的文本框反射ct更新的結果。

這裏的簡單的解決方案是增加值綁定：

<input type="text" 
    data-bind="autocomplete : {label: name, value: id}, value: name"/> 

但你如何做到這一點，而不value結合？

jsbin鏈接：http://jsbin.com/InUHIwE/3/

Answer 1

您只需subscribe您所需的觀測。

因此，我想重新寫我的自定義綁定，如下所示：

ko.bindingHandlers.autocomplete = { 
    init: function (el, valueAccessor) { 
     console.log('init'); 
     var va = valueAccessor(); 
     var lbl = va.label; 
     var val = va.value; 
     lbl.subscribe(function (v) { 
      $(el).val(v); 
     }); 
     console.log('valueaccessor:', va); 
     $(el).autocomplete({ 
      source: src, 
      select: function (evt, ui) { 
       evt.preventDefault(); 
       lbl(ui.item.label); 
       val(ui.item.value); 
       $(el).val(ui.item.label); 
      } 
     }); 
    } 
}; 

jsbin鏈接：http://jsbin.com/InUHIwE/4/