为什么这样做:
<!-- 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'?
答案 0 :(得分:1)
您可以使用visible
绑定来隐藏选择。
至于更大的问题,if
绑定实际上会物理删除与if绑定的元素的所有子 DOM,并将其存储在节点缓存中以供以后检索。这是为了防止可能影响其他文档元素的那些元素中的任何进一步绑定。
例如,在下面的代码段中,如果您打开浏览器的元素检查器并反复按下切换按钮,您将看到浏览器注入并删除span
的innerText。
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;
根据Knockout's if binding documentation:
相应地,可以添加if块中的标记 或 由于表达式更改而动态删除。数据绑定 属性将应用于包含标记的新副本 无论何时重新添加。