Question

我正试图限制foreach项目。这是我的来源：

<div class="build-failed">
    <h1 class="jenkins-status"><span data-bind="title"></span> FAILED</h1>
    <ul class="list-nostyle list-failed">
      <li data-foreach-item="failedJobs">
        <div class="label" data-bind="item.label"></div>
        <div class="value" data-bind="item.value"></div>
      </li>
    </ul>
</div>

<div class="build-succeeded">
    <h1 class="jenkins-status">All <span data-bind="title"></span> builds are successful</h1>
    <i class="fa fa-thumbs-o-up"></i>
</div>enter code here

<p class="updated-at" data-bind="updatedAtMessage"></p>

我希望只获得3个结果。我知道我必须在“data-foreach-item”中添加一些内容，但我不知道它是什么。

Answer 1

使用<iron-list>，您的<ul>可以重写为

<ul>
    <iron-list items="[[failedJobs]]">
        <template>
            <li>
                <div class="label">[[item.label]]</div>
                <div class="value">[[item.value]]</div>
            </li>
        </template>
    </iron-list>
</ul>

尝试查看属性maxPhysicalCount是否只能获得三个结果;）

Answer 2

我以为我会在文档中找到适用的过滤器：

http://batmanjs.org/docs/filters.html

但我找不到一个！ first仅返回一个项，而truncate仅适用于字符串，因此这些都不起作用。

您可以创建自己的过滤器：

https://www.softcover.io/read/b5c051f3/batmanjs_mvc_cookbook/html#sec-custom_filter

例如，要将数组限制为三个项目：

Batman.Filters.limit = (array, limit) -> array?.slice(0, limit)

然后，在你的绑定中使用它：

<li data-foreach-item="failedJobs | limit 3">...</li>

（嗯，我希望data-foreach适用于过滤器！）

无论如何，希望它有所帮助：）

使用聚合物限制foreach（仅获得3个结果）的结果

2 个答案: