Question

我试图在热毛巾模板中使用像的knockoutjs这样的无容器语句，但如果我使用像div这样的元素进行可见绑定，那么它就不用担心了。然后它工作得很好。（{{1} }）

任何人都可以告诉我，如果无格式的knockoutjs声明在热毛巾模板中不起作用吗？

在默认热毛巾模板中，我在home.html和home.js中添加了几行，如下所示：

<div data-bind="visible: IsShowData==true"></div>

并在viewmodels / home.js文件中

views/home.html

<section>
    <h2 class="page-title" data-bind="text: title"></h2>
</section>

<!-- ko if: active()==true -->
hiiiiiiiiiiiiiii
<!--/ko-->


<div data-bind="visible: active() == true">
    byeeeeeeeeeeeee
</div>

我会看到hiiiiiiii但我不会看到byeeeeee

Answer 1

您的问题与Knockout或if无竞争绑定无关，但Durandal.js（由HotTowel模板使用）以及Durandal如何处理视图模型。

因为在Durandal.js中，您的 viewmodel应该只包含一个根元素，它会删除根级别注释。

来自documentation：

视图只有一个根元素。杜兰达需要这个。 如果评论在根目录中找到，它们将被删除。在这种情况下如果找到多个根元素，它们将被包装在一个格。

所以解决方案很简单：只需要section中的两个文本或将所有内容包装成div或section：

<section>
    <h2 class="page-title" data-bind="text: title"></h2>

    <!-- ko if: active()==true -->
         hiiiiiiiiiiiiiii
    <!--/ko-->


    <div data-bind="visible: active() == true">
         byeeeeeeeeeeeee
   </div>
</section>

或者

<div>
     <section>
        <h2 class="page-title" data-bind="text: title"></h2>
     </section>

    <!-- ko if: active()==true -->
       hiiiiiiiiiiiiiii
    <!--/ko-->


     <div data-bind="visible: active() == true">
        byeeeeeeeeeeeee
    </div>
</div>

顺便说一句，您可以简单地写下if: active()==true和visible: active() == true

而不是if: active和visible: active

knockoutjs的无容器声明在hottowel SPA中不起作用？

1 个答案: