Knockoutjs if/shim binding

Question

我想创建一个自定义绑定，其行为与if绑定相似，但不是完全删除该元素，而是将其替换为应该删除的另一个具有相同高度的元素。

我正在努力寻找一种做法，这不是哈克。我不太了解淘汰赛的内幕，以一种有教养的方式去解决这个问题。

任何指针非常赞赏。

谢谢！

Answer 1

你可以编写自己的绑定：

ko.bindingHandlers.shim = { 
    update: function(element, valueAccessor, allBindings) { 

     // First get the latest data that we're bound to 
     var value = valueAccessor(); 

     // Next, whether or not the supplied model property is observable, get its current value 
     var shim = ko.unwrap(value); 

     if (shim) { 
      var shimEl = $(element).data('shim'); 
      // Create the shim element if not created yet 
      if (!shimEl) { 
       shimEl = $('<div />').addClass('shim').appendTo(element); 
       // Equal the height of the elements 
       shimEl.height($(element).height()); 
       $(element).data('shim', shimEl); 
      } 
      shimEl.show(); 
     } else { 
      var shimEl = $(element).data('shim'); 
      if (shimEl) { 
       shimEl.hide(); 
      } 
     } 

     // You can also trigger the if-binding at this point 
     // ko.bindingHandlers.if.update(element, valueAccessor, allBindings); 
    } 
}; 

然后使用它是这样的：

<div data-bind="shim: [condition]"></div>