Question

我试图遍历数据，但我想为团队中的不同成员提供不同的布局，比如组织总裁应该有col-md-12（bootstrap - 屏幕的整个宽度）但是因为有4名副总统他们应该有col-md-3（宽度除以4）。分支A员工可以是col-md-3，B col-md-6，具体取决于最佳状态。

这就是现在的情况。评论部分是我试图做的，并没有起作用。

在member_list.html

中

{{#each members}}
        {{> memberItem}}
{{/each}}

在member_list.js

中

    var CouncilMembers = [
    {
        name: "ABC",
        position: "President",
    },
    ---4 for VPs----
    ---several employees of different branches A, B, C----
    ]

Template.membersList.helpers({
    members: CouncilMembers
});

在member_item.html

中

<template name="memberItem">
    <div class="member">
    <!--{{#if Prez}}
        <div class="member-content">
            <h5 class="name">{{name}}</h5>
            <span class="department">{{position}}</span><br />

        </div>
    {{/if}}
    {{#if VicePrez}}
        <div class="member-content col-sm-3">
            <h5 class="name">{{name}}</h5>
            <span class="department">{{position}}</span><br />
        </div>
    {{/if}}-->
        <div class="member-content col-sm-4">
            <h5 class="name">{{name}}</h5>
            <span class="department">{{position}}/span><br />
        </div>
    </div>
</template>

在member_item.js

中

Template.memberItem.helpers({
 member: function() {
    return member;
 },
 /*
 Prez: function() {
    return member.find({position:'General Secretary'});
 },
 VicePrez: function() {
    return member.find({position:'Vice President'});
 }
 */
});

Answer 1

这里有很多事要做：

在member_list.js中您正在使用数组。我希望您使用Mongo Collection而不是该数组，但这种格式是可以的。所以它会是这样的：

Template.membersList.helpers({
  members: () => CouncilMembers.find(),
});

然后，在member_item.js中，您将在范围内拥有当前项目的所有信息。所以你的助手会是这样的：

Template.memberItem.helpers({
  Prez: function() {
    return this.position === 'General Secretary';
  },
  VicePrez: function() {
    return this.position === 'Vice President';
  }
});

在实施类似的东西之后，你的想法应该有效

流星迭代数据＆amp;助手

1 个答案: