在foreach knockout绑定中使用前一项

Question

我有以下问题:我有一个可观察的数组(从服务器填充),如下所示:

this.elems = ko.observableArray([
    {n: 1, t : 'hello'},
    {n: 1, t : 'why'},
    {n: 1, t : 'are'},
    {n: 2, t : 'some'},
    {n: 2, t : 'ducks'},
    {n: 3, t : 'here'},
    {n: 8, t : '?'}
]);

我希望以下列方式展示它:

      1
Hello
why
are
      2
some
ducks
      3
here
      8
?

如您所见,仅当前一个数字与当前数字不同时才显示数字.这对于foreach绑定来说非常容易(这是我的jsFiddle).

<div data-bind="foreach: elems">
    <div class="t1">
        <span data-bind="text: n" class="c1"></span>
        <span data-bind="text: t" class="c2"></span>
    </div>
</div>

只有我能够访问前一个元素.我知道我可以修改我的observalbe数组并实现我想要的,但有没有办法在不改变它的情况下做到这一点？

Answer 1

您可以访问$ index和$ parent值.试试这个:

<div data-bind="foreach: elems">
    <div class="t1">
        <!-- ko if: $index() === 0 || $parent.elems()[$index() - 1].n !== n -->
        <span data-bind="text: n" class="c1"></span>
        <!-- /ko -->
        <span data-bind="text: t" class="c2"></span>
    </div>
</div>

替代使用可见绑定:

<div data-bind="foreach: elems">
    <div class="t1">
        <span data-bind="text: n, visible: $index() === 0 || $parent.elems()[$index() - 1].n !== n" class="c1"></span>
        <span data-bind="text: t" class="c2"></span>
    </div>
</div>