如何在Meteor.js中将图像数组应用于模板帮助器

Question

I currently am trying to apply an array of images to my template HTML.

var z = [...jpg,...,jpg,...jpg];
var x = ["text","text","text"];

These arrays are stored globally in my file.

Here is my template helper function and I'm just using a sample index to see if it would be display in the HTML but it isn't working properly.

Template.stop.helpers({
    'thumb': function(){
      return  z[1];
    },
    'snippet': function(){
        return x[1];
    }
});

Here is my html template reference

 <template name="stop">  
      <tr>
        <td class="image"><img src="{{thumb}}"></td>
        <td>
         <center>    


    <h2> Do you like this product? </h2>
           <i class="fa fa-check-square-o" style=" font-size: 50px; font-size=50px; margin-top: 50; padding-top: 5px;"></i>
           <h3>{{title}}</h3>
           <h2>{{snippet}}</h2>
        </td>
      </tr>
    </template>

and here is where it's referenced in a div in my body

<div class="bottom">
  {{> stop}}
  </div>

I want these images displayed in a table in my HTML but I'm not even able to display one. Any ideas?

Answer 1

Code seems ok remove var keyword, maybe a duplicated on z x2?

 z = [...jpg,...,jpg,...jpg];
 x = ["text","text","text"];

if you have that array of images pointing to a /public folder add it also.

<td class="image"><img src="public/{{thumb}}"></td>

update

if(Meteor.isClient){
      z = [...jpg,...,jpg,...jpg];
      x = ["text","text","text"];
for(var i=0;i<z.length;i++){
   console.log(z[i])
 }
  Template.stop.helpers({
    'thumb': function(){
      console.log(z[1];
      return  z[1];
    },
    'snippet': function(){
        return x[1];
    }
 });
}