BlazeJS loop roles in default-group

Hi all,

I try #each of Spacebar to display all roles a users are in. But the following code makes the Template not recognise by Meteor build.

Please advice, thank you.

{{#each role in outletEmployeeData.roles.default-group}
    <div class="ui label">
        {{role}}
    </div>
{{/each}}

That’s not a valid JavaScript identifier. Have you tried outletEmployeeData.roles['default-group']?

Hi,

I change it to the following and it still break Meteor build:

{{#each role in outletEmployeeData.roles['default-group']}
    <div class="ui label">
        {{role}}
    </div>
{{/each}}

Can you share your complete template and helper?

Template.outletEmployeeItem.helpers({
    outletEmployeeData: function () {
        let outletEmployeeData = Template.instance().outletEmployeeData.get("outletEmployeeData");
        return outletEmployeeData;
    }
});

“outletEmployeeData” is ReactiveDict. The data are from Collection Find.

The following is the template:

<template name="outletEmployeeItem">
    <tr>
        <td>{{outletEmployeeData.firstName}} {{outletEmployeeData.lastName}}</td>
        <td>
            {{#each role in outletEmployeeData.roles['default-group']}
            <div class="ui label">
                {{role}}
            </div>
            {{/each}}
        </td>
        <td class="center aligned">
            {{checkSuspend employee.employee_id}}
        </td>
        <td class="center aligned">
            {{> outletEmployeeActionButton employee=employee}}
        </td>
    </tr>
</template>

Try the following template which minimises the re-use of the helper and also restructures the each:

<template name="outletEmployeeItem">
  {{#let outletData=outletEmployeeData}}
    <tr>
      <td>{{outletData.firstName}} {{outletData.lastName}}</td>
      <td>
        {{#let roles=outletData.roles['default-group']}}
          {{#each role in roles}}
          <div class="ui label">
            {{role}}
          </div>
          {{/each}}
        {{/let}}
      </td>
      <td class="center aligned">
        {{checkSuspend employee.employee_id}}
      </td>
      <td class="center aligned">
        {{> outletEmployeeActionButton employee=employee}}
      </td>
    </tr>
  {{/let}}
</template>

However, I think you may need to do something similar with employee.

Thanks, will try it now and post update here. Thanks again.

1 Like

I try use the template you provide above, I get the following error which is the same as previous:

Uncaught Error: Cannot find module './outletEmployeeItem.html'

Sorry for the trouble. Not sure how to fix this.

As my previous Spacebar error, when I comment out the “role” #each Spacebar, there are no more error.

Same when I comment out the following part of the template:

{{#let roles=outletData.roles['default-group']}}
    {{#each role in roles}
        <div class="ui label">
            {{role}}
        </div>
    {{/each}}
{{/let}}

This is the part that cause the error.

You’ve not shared that error before. That looks like you’ve imported it incorrectly in the client .js file.

There’s a missing } in that line. My fault - sorry. Coding in the browser’s never a good idea!

Hi, true that it looks like missing correct import of template. But that error doesn’t exist when comment out the role part in the template.

So that’s what I mean by it break the template.

I added the missing } but the error is exactly the same.

Can you share an exampleoutletEmployeeData document?

{
     "firstName":"User  02",
     "lastName":"Sample",
     "roles":
          {"default-group":["appuser"]}
}

Here, thanks.

As an alternative way to achieve what I need, I created a new “roles” helper that show roles without error:

roles: function () {
        let outletEmployeeData = Template.instance().outletEmployeeData.get("outletEmployeeData");
        let defaultGroup;
        if (outletEmployeeData) {
            defaultGroup = outletEmployeeData.roles['default-group'];
            console.log(defaultGroup);
            return defaultGroup
        }
    }

But I really hope I can understand and get the initial solution work.

One thing for sure is this line in Spacebar cause error. Need the correct code for this line.

Yes. I’m sure that worked for me before now, but it’s been a while.

It looks like [] is not allowed. That means you must either have a dedicated helper (as you have got working) or change the default-group to something like default or default_group. Either of those will work with standard object syntax: outletData.roles.default or outletData.roles.default_group.

1 Like

Ok, thanks again for the info. I’ll just use the dedicated helper for now. Maybe I’ll change the group name in later stage.

Thanks again, very much appreciate your help.

1 Like