Question

我最初有类似以下内容：

<span data-bind="foreach: objects">
    <span data-bind="if: object.type() === 'menuItem'>
       ...
    </span>
</span>

这在技术上有效，但它实际上为每个对象创建了一个DOM元素，无论其类型如何，但匹配的元素是唯一“填充”的元素。它在UI中留下了一些空白。

我转而使用虚拟元素，它运行得更好，但仍然在DOM中显示为

<!-- ko if: object.type() === 'menuItem'>
<!-- /ko -->

表示所有不匹配的元素。

有没有办法在原始foreach中嵌入if语句，或者以某种方式在viewmodel中执行此逻辑会更好吗？

Answer 1

你不能将if嵌入到与foreach相同的元素中，因为它们试图控制相同的后代绑定，这是Knockout在你尝试时会给你的错误。

http://jsfiddle.net/h92LY/

使用无容器绑定是100％正确的方向。另一种选择是使用计算，其中条件在其中，但是将表示逻辑带入视图模型 -

查看模型 -

var showingObjects= ko.computed(function () {
    return ko.utils.arrayFilter(objects(), function(object) {
        return object.type() === 'menuItem';
    });
});

查看 -

<span data-bind="foreach: showingObjects">
       ...
</span>

如果property = value，Knockout foreach只显示？

1 个答案: