knockoutjs:选项标签和可见性问题

twi*_*ino 5 knockout.js

似乎我们在两组浏览器之间对html SELECT标签的OPTIONS的可见性有不同的行为:如果我在OPTION标签中将visible设置为false,则相关的下拉列表项隐藏在Chrome和Firefox中,但它是在IE8和Safari中仍然可见.

http://jsfiddle.net/v8gyG/12/

你有什么建议或者我做错了吗?请注意,在这种情况下我不能使用jquery.tmpl.js,只能使用硬编码的SELECT/OPTION标签

Woj*_*iak 5

我知道这是很久以前的问题了,但是自从我在谷歌找到这个问题的同时自己寻找答案时,这是值得回答的.我想出了解决方案,所以我回到这里分享它.两年和"可见"仍然不起作用**,所以我检查"如果"绑定.在选项元素中对数据进行数据绑定使其隐藏但可选择.Knockout还有一个叫做"无容器控制流语法"的东西.

这对我有用:

   <!-- ko if: category.parent == 0 -->
     <option data-bind="value: category.name, text: category.name"></option>
   <!-- /ko -->
Run Code Online (Sandbox Code Playgroud)

它的工作原理是因为隐藏了DOM.来自淘汰赛网站:

如果扮演与可见绑定类似的角色.不同之处在于,通过可见,包含的标记始终保留在DOM中并始终应用其数据绑定属性 - 可见绑定仅使用CSS来切换容器元素的可见性.但是,if绑定在物理上添加或删除DOM中包含的标记,并且仅在表达式为true时才对后代应用绑定.

您可以在文档中阅读更多内容:http://knockoutjs.com/documentation/if-binding.html

在这里查看各种选项:http://jsfiddle.net/v8gyG/24/

**"可见"适用于Chrome 27和Firefox 21,但不适用于Chrome中的多选.

<!-- ko if: --> 也可以在IE 10中使用,也可以在Chrome中使用multiselect.