Knockout：關於可觀察更新的高亮元素

Question

我想突出顯示observable被更新時綁定到observable的元素，但是當observable的綁定被inited時沒有。

我試圖用一個定義綁定：

<div data-bind="updateHighlighting: name, text: name"></div> 
<input data-bind="value: name" /> 

ko.bindingHandlers.updateHighlighting = { 
    update: function(element, valueAccessor) { 
     $(element).effect("highlight", 2000); 
    } 
}; 

var vm = { 
    name: ko.observable("Diego") 
}; 

ko.applyBindings(vm); 

但更新回調不僅運行時可觀察到的更新，而且在自定義綁定的初始化。所以在綁定初始化時會突出顯示一個不需要的元素。

我可以知道，在更新回調中，如果我在綁定的初始狀態下執行下面的操作？

ko.bindingHandlers.updateHighlighting = { 
    update: function(element, valueAccessor) { 
     if(!isInit) 
      $(element).effect("highlight", 2000); 
    } 
}; 

Answer 1

一個簡單的方法是使用擊倒ko.utils.domData功能，如：

ko.bindingHandlers.updateHighlighting = { 
    update: function(element, valueAccessor) { 
     var key = "_my_init_key_", 
      isInit = ko.utils.domData.get(element, key); 

     if(isInit) { 
      $(element).effect("highlight", 2000); 
     } 
     else { 
      ko.utils.domData.set(element, key, true); 
     } 
    } 
}; 

這真的只是在元素上設置的expando屬性，所以用它來保持狀態。 Knockout會在刪除元素時清除它，如果使用API​​，儘管在存儲基元時它不是什麼大問題。

因爲您使用的是jQuery，您也可以使用$ .data來存儲標誌。