#each problems how to iterate from array

help
1

Hello, I am trying to make an app with meteor and have run into some trouble with using #each

So my html is

<body>
	<div class="container-fluid">
		<div class="row">
			<div class="col-md-6">
				<form>
					<ol>
						{{#each cclist}} {{> task}} {{/each}}
					</ol>
				</form>

			</div>

		</div>

	</div>

</body>

<template name="task">
	<li>
		<input type="checkbox"> Speech # {{title}}
	</li>
</template>

and my JS is

Template.body.helpers({
	cclist() {
		let title =['1: The Ice Breaker', '2: Organize your Speech', ];
		return title;
	}
});

I am trying to create a list with the text inside the titles array as list values (there will eventually be more items in the array).

I know how to do this when querying the database but not just from an array.

Thank you!

2

You can use #each with arrays. Normally we use arrays of objects not arrays of strings, but nothing stopping you from doing this:

{{#each value in array}}
   <p>{{value}}</p>
{{/each}}
3

Hmm I was trying to implement that logic. What about my code doesn’t work?

4

it doesn’t work because you are passing an array of strings, then looking for key title in it

Template.body.helpers({
	cclist() {
		return [
                    {title: '1: title1'},
                    {title: '2: title2'}
                ];
	}
});

I am also not sure of scope (in task), I typically pass my variables to templates explicitly, debug that if it’s the issue.

5

What do you mean pass variables to templates explicitly?

I still can’t get it to work for some reason arrg. I tried doing it as you said with

{{#each value in array}}
   <p>{{value}}</p>
{{/each}}

but it’s not working.

What would be best way to do this. Getting really frustrated :frowning:

6

I found a great guide here I am going to try and use :smiley:

1 Like