I'm doing this Meteor course where an old version of Meteor is used and unsure of where to put files and folders. I have images in a public folder which is in my main folder and the following main.html client code
<head>
<title>image_share</title>
</head>
<body>
<h1>Welcome to Coursera!</h1>
{{>images}}
</body>
<template name="images">
{{#each images}}
<img src="{{img_src}}" height="100" alt="{{img_alt}}" />
{{/each}}
</template>
and the following client code main.js
if (Meteor.isClient) {
console.log("I am the client");
var img_data = [
{
img_src:"image1.jpg",
img_alt:"dental surgery"
},
{
img_src:"image2.jpg",
img_alt:"carribean night"
},
{
img_src:"image3.jpg",
img_alt:"full moon palm tree"
},
];
Template.images.helpers({images:img_data});
}
My problem is only image1.jpg is appearing in the browser window.
Your helpers should be functions:
And in your template its good to explicitly reference to the data in the loop in context of "this":
"This" refers here to the current object in the array, you iterate.