条件逻辑是否在默认的knockout.js 2.0模板引擎下工作？

Question

下面的条件不能与我的默认模板knockout.js 2.0一起使用.它只写出了IF语句.

  <span data-bind="foreach: admin.home.paging.pages">
        {{if $data == app.viewModel.admin.home.paging.page()}}
        <span data-bind="html: $data"></span>
        {{else}}
        <a href="#" data-bind="click: app.viewModel.admin.home.paging.searchByPage($data), html: $data"></a>
        {{/if}}

    </span>

UPDATE

我改为做了以下.

 <span data-bind="foreach: admin.home.paging.pages">
        <span data-bind="html: $root.admin.home.paging.page(), visible: $data == $root.admin.home.paging.page()"></span>
        <a href="#" data-bind="click: function() { $root.admin.home.searchByPage($data); }, html: $data, visible: $data != $root.admin.home.paging.page()"></a>
    </span>

Answer 1

您的代码使用的是jquery tmpl,但默认情况下Knockout使用其本机模板引擎.如果需要jquery tmpl,则必须覆盖本机引擎.如果您需要本机引擎,可以在本机模板中使用if绑定:

<span data-bind="foreach: admin.home.paging.pages">
        <!-- ko if: $data === app.viewModel.admin.home.paging.page() -->
            <span data-bind="html: $data"></span>
        <!-- /ko -->
        <!-- ko if: $data !== app.viewModel.admin.home.paging.page() -->
            <a href="#" data-bind="click: app.viewModel.admin.home.paging.searchByPage($data), html: $data"></a>
        <!-- /ko -->
</span>

但是,我也建议做一些改动.我会从你的html中抽象逻辑并在你的viewmodel中创建一个函数来执行评估并返回true/false.例如

<!-- ko if: isSamePage() -->

如果可以的话,我会稍微缩短你的对象层次结构.另外,请考虑使用with块.

如果您正在迭代admin.home.paging.pages,那么该循环内的每个对象都是该对象层次结构的子对象.换句话说,您不必继续指定整个对象链.