如何在使用敲除`選項`綁定時將`data`屬性值設置爲`option`

Question

在淘汰賽的documentation中，它提到了optionsAfterRender。我試圖在沒有成功的情況下添加data屬性值。

下面是從文檔樣本：

<select size=3 data-bind=" 
    options: myItems, 
    optionsText: 'name', 
    optionsValue: 'id', 
    optionsAfterRender: setOptionDisable"> 
</select> 

<script type="text/javascript"> 
    var vm = { 
     myItems: [ 
      { name: 'Item 1', id: 1, disable: ko.observable(false)}, 
      { name: 'Item 3', id: 3, disable: ko.observable(true)}, 
      { name: 'Item 4', id: 4, disable: ko.observable(false)} 
     ], 
     setOptionDisable: function(option, item) { 
      ko.applyBindingsToNode(option, {disable: item.disable}, item); 
     } 
    }; 
    ko.applyBindings(vm); 
</script> 

這裏就是我試過，但沒有工作，但也沒有錯誤。

setOptionDisable: function(option, item) { 
    $(option).text(''); // this will blank out the text in options 
    $(option).data('test', '123'); // but this won't do anything at all. 
    $(option).attr('data-test', '123'); // this worked as pointed out by Matt 
} 

Answer 1

jQuery的實際分配data attr但並不DOM元素上顯示因爲jQuery在內部數據結構保存它。 如果你記錄你最近的數據屬性，你會得到這個值，但是你不會在DOM上看到。

例子：https://jsfiddle.net/kyr6w2x3/83/

但是如果你使用attr()它更新DOM屬性爲好。

示例https://jsfiddle.net/kyr6w2x3/84/