Question

我想生成一个类似这样的模板：

<ul>
 <li>A B C D</li>
 <li>E F G H</li>
</ul>

我提供给模板的数据是一个有8行的光标（每个字母一个）。

我知道我可以进行提取并将结果分成4组，但如果我没有弄错，则提取效率较低，例如我将A的值更新为1，它会重新加载所有内容。

对于如何做到这一点的任何建议表示赞赏。

Answer 1

HTML：

<template name="outer">
  <ul>
    {{#each list}}
      {{> quadItem }}
    {{/each}}
  </ul>
</template>

<template name="quadItem">
  <li>{{#each quad}}{{item}} {{/each}}</li>
</template>

JS：

Template.outer.helpers({
  list: function(){
    var arrayOfQuads = [];
    var array = myCollection.find().fetch();
    for ( var i = 0; i < array.length; i += 4 ){
      arrayOfQuads.push(array.slice(i,i+3));
    }
    return arrayOfQuads;
  }
});

Template.quadItem.helpers({
  quad: function(){
    return this;  // data context should be one row of arrayOfQuads
  },
  item: function(){
    return this; // data context should be one element of a quad
  }
});

这是非常快速和肮脏的，我相信它可以变得更加优雅。例如，请参阅how to make an array element selectable by index in blaze。

将光标分割成模板

1 个答案: