Question

我试图检测哪个模板包含另一个模板，以便为特定模板包含提供不同的css类。我已经问过这个问题here。

建议的解决方案是这样的：

app.html：

<body>
  {{> parentTemplate parentContext}}
</body>

<template name="parentTemplate">
  {{> childTemplate specialContext}}
  {{> childTemplate}}
</template>

<template name="childTemplate">
  <div class="{{isSpecialClass}}">
    <p>parent name: {{name}}</p>
  </div>
</template>

app.js

if (Meteor.isClient) {
  Template.body.helpers({
    // add some context to the parent do demo how it can be modified
    parentContext: {name: 'dave'}
  });

  Template.parentTemplate.helpers({
    specialContext: function () {
      // make a copy of the parent data context
      var data = _.clone(Template.instance().data || {});
      // modify the context to indicate the child is special
      data.isSpecial = true;
      return data;
    }
  });

  Template.childTemplate.helpers({
    isSpecialClass: function () {
      // grab the context for this child (note it can be undefined)
      var data = Template.instance().data;
      if (data && data.isSpecial)
        // add the 'awesome' class if this child is special
        return 'awesome';
    }
  });
}

现在问题是我的childTemplate的上下文为parentTemplate。我检查了parentTemplate的数据，它有字段isSpecial，它只有错误的上下文。知道为什么会这样吗？例如，如果我在{{title}}中使用childTemplate，我将获得父上下文对象的标题，但我想要childTemplate的上下文。

Answer 1

我误解了原来的问题。我的回答过于复杂，因为我认为必须保留父上下文。如果您只需要修改子上下文，它实际上会更容易一些。这是一个有效的例子：

app.html

<body>
  {{> parentTemplate}}
</body>

<template name="parentTemplate">
  {{#each children}}
    {{> childTemplate}}
  {{/each}}
</template>

<template name="childTemplate">
  <div class="{{isSpecialClass}}">
    <p>name: {{name}}</p>
  </div>
</template>

app.js

if (Meteor.isClient) {
  Children = new Mongo.Collection(null);

  Meteor.startup(function () {
    Children.insert({name: 'joe'});
    Children.insert({name: 'bob'});
    Children.insert({name: 'sam'});
  });

  Template.parentTemplate.helpers({
    children: function () {
      // find all of the children and modify the context as needed
      return Children.find().map(function(child, index) {
        // modify the child context based on some aspect of the child or index
        if ((index == 0) || (child.name == 'bob'))
          child.isSpecial = true;

        return child;
      });
    }
  });

  Template.childTemplate.helpers({
    isSpecialClass: function () {
      // add the 'awesome' class if this child is special
      if (this.isSpecial)
        return 'awesome';
    }
  });
}

在此版本中，父级会找到所有子级，并通过将isSpecial添加到子级上下文来修改每个子级，如果子级列表中的第一个或者子级已有名字＆＃39; bob＆＃39;。现在，孩子只需要在其类助手中检查this.isSpecial。如果您有任何问题，请与我们联系。

childTemplate中的ParentContext - Meteor

1 个答案:

app.html

app.js