淘汰bug?,无法匹配评论结束

时间:2013-09-18 10:11:23

标签: javascript html knockout.js

无法弄清楚为什么这不起作用?....

<!-- ko if: $root.List().length > 1 || $root.AnyNotEqualToSelectedLanguage() -->
    <div>
         <select data-bind="options: $root.List, optionsText: 'displayText', value: selectedValue, optionsCaption: 'Choose...'"></select>
    </div>
<!-- /ko -->

上面的代码生成“无法找到匹配的结束注释标记:ko if:$ root.List()。length&gt; 1 || $ root.AnyNotEqualToSelectedLanguage()”

而.......

<!-- ko if: $root.List().length > 1 || $root.AnyNotEqualToSelectedLanguage() -->
    <span>
         <select data-bind="options: $root.List, optionsText: 'displayText', value: selectedValue, optionsCaption: 'Choose...'"></select>
    </span>
<!-- /ko -->

这有效....

对这个问题有快速了解的人?

1 个答案:

答案 0 :(得分:4)

我可以针对第一个代码块无效的唯一有效解释是因为您的代码块可能在<p></p>标记内

例如

<p>
<!-- ko if: $root.List().length > 1 || $root.AnyNotEqualToSelectedLanguage() -->
    <div>
         <select data-bind="options: $root.List, optionsText: 'displayText', value: selectedValue, optionsCaption: 'Choose...'"></select>
    </div>
<!-- /ko -->
</p>

由于p不能包含block级元素,因此浏览器会在看到p时关闭div代码。这个浏览器最终将其视为:

<p>
    <!-- ko if: $root.List().length > 1 || $root.AnyNotEqualToSelectedLanguage() -->
</p>
        <div>
             <select data-bind="options: $root.List, optionsText: 'displayText', value: selectedValue, optionsCaption: 'Choose...'"></select>
        </div>
    <!-- /ko -->
<p></p>

此时,淘汰赛无法解析它。

您可以检查为小提琴生成的来源:http://jsfiddle.net/jcHzK/1/

由@Artem创建的同一小提琴不起作用,因为代码现在位于p标记内。

您的第二个代码有效,因为您已将块元素div替换为内联元素span

一些代码和段落来自https://github.com/knockout/knockout/issues/346