Aurelia repeat.for limit

Question

我正在开发Aurelia的应用程序，让我说我有一个循环：

<div repeat.for="t of allTags">${t.name}</div>

有很多条目很自然地我想限制它们的数量。所以基本上我想要像Angular的重复限制一样：

<div ng-repeat="t in allTags | limitTo:5 ">{{t.name}}</div>

我已在此处检查了文档http://aurelia.io/docs.html，但未找到有关此主题的任何内容。

Aurelia有这样的功能吗？如果不是，我是否宁愿在控制器中剪切列表，并在$index的视图中执行此操作？

谢谢！

Answer 1

选项1：使用值转换器。

<强>取值-converter.js

export class TakeValueConverter {
  toView(array, count) {
    return array.slice(0, count);
  }
}

<强> app.html

<require from="./take-value-converter"></require>

<div repeat.for="t of allTags | take:5">${t.name}</div>

此方案的实例和其他许多 here 。

aurelia.io上有关价值转换器的其他文档

选项2：重复数字

<div repeat.for="i of 5">${allTags[i].name}</div>

Answer 2

如果您想从不同的值开始，可以修改TakeValueConverter 在toView方法中添加第三个参数。

toView(array,start,count){
  return array.slice(start,count);
}

但是你必须以某种方式跟踪最后的位置

Answer 3

<div if.bind="$index<5" repeat.for="t of allTags">${t.name}</div>

使用索引以及是否阻止超出索引标准的其余记录