Question

如果我将聚合函数应用于使用空数组（[]）初始化的嵌套observableArrays，我会得到内部数组未定义的错误。这只发生在使用空数组作为参数构造的observableArray对象上。

这可能是一个错误，但也许/希望我只是遗漏了一些东西。

下面的示例使用空数组行注释掉：

也在：http://jsfiddle.net/adamtolley/4pZhR/32/

HTML：

    <ul data-bind="template: { name: 'outerTmpl', foreach: outerArray}"></ul>
Number of inner items: <span data-bind="text: innerCount"></span>
<hr />

<div data-bind="text: ko.toJSON(viewModel)"></div>

<script id="outerTmpl" type="text/html">
    <li>
        <span data-bind="text: name"></span>
        <ul data-bind="template: { name: 'innerTmpl', foreach: innerArray}"></ul>
    </li>
</script>

<script id="innerTmpl" type="text/html">
    <li>
        <span data-bind="text: name" />
    </li>
</script>

JS：

function outer(name, innerArray) {
    return {
        name: ko.observable(name),
        innerArray: ko.observableArray(innerArray)
    };
}

function inner(name) {
    return {
        name: ko.observable(name)
    };
}

var viewModel = {
    outerArray: ko.observableArray([
        new outer("outer1", [new inner("inner1"), new inner("inner2")]),
        new outer("outer2", [new inner("inner1"), new inner("inner2")]) //,
        // new outer("outer3", []) //does not work with this line uncommented. 
    ])
};

//use of innerArray().length vs innerArray.length seems to make no difference in error   
viewModel.innerCount = ko.dependentObservable(function() {
    return this.outerArray().reduce(function(i, j) {
        return i.innerArray.length + j.innerArray.length;
    });
}, viewModel);


ko.applyBindings(viewModel);

Answer 1

我认为你会想要更像的东西：

viewModel.innerCount = ko.dependentObservable(function() {
    return this.outerArray().reduce(function(i, j) {
        var count = i.innerArray ? i.innerArray().length : i;
        return count + j.innerArray().length;
    });
}, viewModel);

问题是reduce会在下一次迭代时将前一个结果作为i传递。因此，第一次迭代时只有两个数组。

Knockout嵌套的observableArrays似乎是未定义的而不是空的。

1 个答案: