如何在嵌套{{#each}}中访问外部属性?

时间:2015-11-25 18:17:27

标签: javascript meteor meteor-blaze spacebars

我有一个{{#each}}块,它运行一个驱动程序必须停止的列表。每个停靠点都需要有一个选择运行,而选择从另一个集合中引入。所以我选择了另一个{{#each}}

现在我需要以编程方式检查是否已在数据库中为此特定停止选择了驱动程序,因为选择正在运行并且已选中它。

我的问题是我需要访问外部{{#each}}的信息才能在内部{{#each}}进行比较。

以下是我的代码,但在运行代码时,stopNumundefined

非常感谢任何帮助。

<td class="text-left">
    {{#if notEquals stopNum 0}}
    <select class="form-control driverName clearForm" id="driverName{{stopNum}}" name="driverName{{stopNum}}">
        <option value="" ></option>
        {{#each drivers}}
        {{#if dispatchDriverSelected driversName stopNum}}
        <option value="{{driversName}}" selected>{{driversName}}</option>
        {{else}}
        <option value="{{driversName}}">{{driversName}}</option>
        {{/if}}
        {{/each}}
    </select>
    {{/if}}
</td>

1 个答案:

答案 0 :(得分:1)

#each内,上下文设置为当前元素。

如果您想获取外部项目/属性,可以在模板代码中使用..或在帮助程序中使用Template.parentData(numLevels)来获取父上下文:

{{#each drivers}}
    {{#if dispatchDriverSelected driversName ../stopNum}}
        <option value="{{driversName}}" selected>{{driversName}}</option>
    {{else}}
        <option value="{{driversName}}">{{driversName}}</option>
    {{/if}}
{{/each}}

这是一个简单的例子:

模板结构:

<template name="example">
  {{#with datum}}
    <div class="wrapper">
    {{outer}}
    <div class="items">
      {{#each inner}}
        <div class="inner">
        {{prop}} {{someFunc ../outer}}
        </div>
      {{/each}}
    </div>
  </div>
  {{/with}}
</template>

助手:

Template.example.helpers({
  datum() {
    return {
      outer: 'outer 1',
      inner: [{
        prop: 'inner 1'
      },{
        prop: 'inner 2'
      }]
    }
  },
  someFunc(datum) {
    return `processed ${datum}`;
  }
});

呈现给:

<div class="wrapper">
  outer 1
  <div class="items">          
    <div class="inner">
      inner 1 processed outer 1
    </div>

    <div class="inner">
      inner 2 processed outer 1
    </div>

  </div>
</div>