敲门如果绑定不适用于<select> </select>

时间:2014-12-03 22:59:05

标签: knockout.js

为什么这样做:

<!-- ko if: show -->
    <select data-bind="options: categories, optionsText: 'name', optionsCaption: 'Select', value: selected_category"></select>
<!-- /ko -->

而这不是:

<select data-bind="if: show, options: categories, optionsText: 'name', optionsCaption: 'Select', value: selected_category"></select>

换句话说为什么无法显示boolean在数据绑定中使用'if'?

1 个答案:

答案 0 :(得分:1)

您可以使用visible绑定来隐藏选择。

至于更大的问题,if绑定实际上会物理删除与if绑定的元素的所有 DOM,并将其存储在节点缓存中以供以后检索。这是为了防止可能影响其他文档元素的那些元素中的任何进一步绑定。

例如,在下面的代码段中,如果您打开浏览器的元素检查器并反复按下切换按钮,您将看到浏览器注入并删除span的innerText。

&#13;
&#13;
var vm = {
  show: ko.observable(true),
  toggle: function() {
    this.show(!this.show());
  }
};

ko.applyBindings(vm);
&#13;
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<span data-bind='if:show'>Show Me</span>
<input type='button' data-bind='click: toggle' value='Toggle' />
&#13;
&#13;
&#13;

根据Knockout's if binding documentation

  

相应地,可以添加if块中的标记 或   由于表达式更改而动态删除。数据绑定   属性将应用于包含标记的新副本   无论何时重新添加。