流星 - 一个数组#each迭代，每个n项后插入另一个HTML元素 [英] Meteor - #each iteration of an array with another HTML element inserted after each nth item

问题描述

我遍历使用火焰使用#each迭代流星项目的数组，我想每个插入第n（10日）项目之后的HTML元素。我想我可以用@index访问数组我在什么指标，但真的不知道如何插入另一个元素每隔10个元素。

  {{＃每一个的getArray}}
  ＆LT; D​​IV CLASS =项目的数据值={{someHelper @index}}＆GT; {{}这个}＆LT; / DIV＆GT;
{{/每}}
 

解决方案

根据您的意见，好像你想使返回是否不应该在DOM元素自定义助手：

  {{＃每一个的getArray}}
  ＆LT; D​​IV CLASS =项目的数据值={{someHelper @index}}＆GT; {{}这个}＆LT; / DIV＆GT;
  {{＃如果shouldAddDiv @index}}
    ＆LT; D​​IV＆GT;！我是第10个项目后＆LT; / DIV＆GT;
  {{/如果}}
{{/每}}Template.TemplateName.helpers（{
  shouldAddDiv（指数）{
    如果（指数％10 === 0）{
      返回true;
    }其他{
      返回false;
    }
  }
}）;
 

如果您不希望div来的第一个元素出现后，你会改变指数10％到索引％9

I'm iterating over an array of items in Meteor using Blaze using the #each iterator, and I want to insert an HTML element after each nth (10th) item. I figured I could use @index to access what index of the array I'm at, but don't really know how to insert another element every 10th element.

{{#each getArray}}
  <div class="item" data-value="{{someHelper @index}}">{{this}}</div>
{{/each}}

解决方案

Based on your comment, it seems like you'd want to make a custom helper that returns whether or not you should have an element in the DOM:

{{#each getArray}}
  <div class="item" data-value="{{someHelper @index}}">{{this}}</div>
  {{#if shouldAddDiv @index}}
    <div>I was after the 10th item!</div>
  {{/if}}
{{/each}}

Template.TemplateName.helpers({
  shouldAddDiv(index) {
    if(index % 10 === 0) {
      return true;
    } else {
      return false;
    }
  }
});

If you don't want the div to appear after the first element, you'd change the index % 10 to index % 9

这篇关于流星 - 一个数组#each迭代，每个n项后插入另一个HTML元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！