I'm trying to create an online-list for a chat. Whenever a person moves into a room, his nickname gets pushed into the array inRoom, when he leaves it gets pulled out again. This works fine so far. Displaying the arrays on the actual list confuses me though.
I need the names to be separated in order to take put them in anchor tags since those names are url-parameters.
A room-document looks like this:
{
"_id": "crsEES5d22uYJiqDZ",
"name": "Room",
"roomdesc": " ",
"inRoom": [name1, name2, name3],
"createdAt": "2019-06-08T12:39:51.382Z",
"owner": "Kuroki"
}
I have a helper to get the array. I use getParam to get the name of the room in order to find the right one.
Template.onlineliste.helpers({
roomData() {
var name = FlowRouter.getParam('name');
return Channels.find({name:name}, {sort: {createdAt: 1}})
},
});
Then I tried to iterate which of course will show the array as a whole and not every name as single value
<template name="onlineliste">
{{#each roomData}}
{{inRoom}}
{{/each}}
</template>
Could someone show me how to iterate the single values of the array so they will display like
instead of Name1, Name 2, Name 3
Thanks for any help
Could someone show me how to iterate the single values of the array so they will display like ...
The field inRoom
is itself an array, so you need a second each
:
<template name="onlineliste">
{{#each room in roomData}}
<ul>
{{#each name in room.inRoom}}
<li>{{name}}</li>
{{/each}}
</ul>
{{/each}}
</template>
If there is anyway only one room to be displayed you can even change your code to return the current single room:
Template.onlineliste.helpers({
roomData() {
var name = FlowRouter.getParam('name');
return Channels.findOne({name:name}})
},
});
which returns only one room document by name and does not require to be iterated. Then you can access it via the following:
<template name="onlineliste">
{{#with roomData}}
<ul>
{{#each name in this}}
<li>{{name}}</li>
{{/each}}
</ul>
{{/with}}
</template>