如何使用Meteor.js中的Template辅助对象迭代对象中的两个数组

How iterate through two array in a object using Template helpers in Meteor.js

本文关键字：对象 数组 两个 迭代 中的 js Meteor Template 何使用      更新时间：2024-04-29

我的HTML类似于这个

<template name="stop">  
   {{#each thumb}}
  <tr>
    <td class="image" ><img src="{{this.data}}"></td>
    <td>
     <center style="float:right; margin-bottom: 25%;">    
       <h2> Do you like this product? </h2>
       <h2>{{this.text}}</h2></center>
    </td>
  </tr>
  {{/each}}
</template>

这个模板指的是我的模板助手，看起来像这个

Template.stop.helpers( {
        'thumb': function(data) {
            console.log(z);
            return tweetImages.findOne()
        })

tweetImage.findOne（）输出此

Object {_id: "1", data: Array[7], text: Array[7]}

每次运行模板时，我都试图遍历两个数组中的每个项，但每次都会输出每个数组的所有7个值。我知道在某个地方需要上下文变量，但我无法计算出来。有人有什么想法吗？

findOne只返回一个元素，因此each只迭代一次。您需要一个嵌套的each来遍历data或text属性，如下所示：

{{#each thumb}}
  ...
  {{#each data}}
    //but you won't be able to get 'text' here
  {{/each}}
  ...
{{/each}}

但是正如您所看到的，您将无法使用此方法同时访问数据和文本数组。也许你可以修改你的助手返回的数据，使其具有以下形式：

[
  {data: ..., text: ...},
  {data: ..., text: ...},
  {data: ..., text: ...},
  ...
]

所以你可以做：

{{#each thumb}}
  ...
  {{data}}
  {{text}}
  ...
{{/each}}

要重写数据，可以使用for循环：

Template.stop.helpers({
  'thumb': function() {            
    var result = tweetImages.findOne();
    var newResult = [];
    for(var i = 0; i < result.data.length; i++) {
      newResult[i] = {data:result.data[i], text:result.text[i]};
    }
    return newResult;
  }
});
相关文章：