1

我想使用虚拟元素来遍历集合，但前提是集合存在于视图模型中。我最初的猜测是添加一个 virtual if 后跟一个 virtual foreach ，如下所示：

<!-- ko if: items -->
    <!-- ko foreach: items -->
        <span data-bind="text: $data"></span>
    <!-- /ko -->
<!-- /ko -->

使用给定的视图模型，如果集合存在，我的视图模型会正确绑定。但是由于某种原因，如果没有，KnockoutJS 会抛出一个异常，说我的集合没有定义。这是有道理的，除非我取出 foreach 语句。如果集合不存在，则 if 语句作为例外运行并且不绑定。我在http://jsfiddle.net/danlister/qhL7e/给出了一个更好的例子。

4

2 回答 2

4

你的小提琴提供了两个不同的问题。

第一个问题

第一个在于 items 是 observableArray 的事实。因为这个事实，当你测试时

<!-- ko if: items -->

它总是返回 true 因为 observableArray 只是一个函数调用。要解决此问题，您可以检查数组是否为空，因为您知道 items 数组将始终存在，例如

<!-- ko if: items().length !== 0 -->

第二个问题

据我所知，第二个问题（在你的小提琴中引用 noitems 数组）无法完成。这是因为在第一次将绑定应用到页面时，它会计算所有 if 语句，并且只有在其中一个可观察变量发生变化时才会更新它们。由于数组在创建时不存在，因此永远不会重新评估它。

我创建了一个小提琴来展示这两种情况：http: //jsfiddle.net/Rynan/3UMTM/。请注意，当您为第一个问题删除数组中的所有元素时，“test”如何消失，以及即使文本更新，当您切换 noitems 布尔值时，“Taa-daa”如何永远不会出现。

于 2012-09-07T16:02:11.027 回答
0

问题出在这个...

<!-- ko if: noitems -->
    <!-- ko foreach: noitems -->
        <span data-bind="text: $data"></span>
    <!-- /ko -->
<!-- /ko -->

您需要noitems在视图模型中定义一个成员。

编辑

你可能可以做这样的事情来解决它 - 我还没有尝试过。

<!-- ko if: noitems -->
    <!-- ko foreach: noitems && noitems() -->
        <span data-bind="text: $data"></span>
    <!-- /ko -->
<!-- /ko -->
于 2012-09-07T08:42:20.463 回答