Question

Template.parentData()这似乎是一个开放式关闭的案例，但到目前为止，我从来没有设法让那个坏孩子正常工作。

我想要的是根据点击的按钮更新文档的事件，但按钮本身依赖于文档深处埋藏的数组，_id不在存在。

以下是我所拥有的：

首先，设置上下文peopleList：

的助手

Template.people.helpers({
  peopleList: function() {
    return People.find()
  }

我用它在HTML中迭代，打印出数据库中存储的每个人的名字和姓氏，以及他们喜欢的颜色（删除了无关的标记）：

{{#each peopleList}}
  <li>
    {{firstName}} {{lastName}}
    {{#each favoriteColors}} <button>{{this}}</button> {{/each}}
  </li>
{{/each}}

此时应该注意favoriteColors是包含数组的文档中的一个键。所以整个事情看起来像这样：

{
  firstName: "Johnny",
  lastName: "Boy",
  favoriteColors: ["red", "blue", "blanchedAlmond"]
}

现在想象一下，我希望能够按下任何这些按住喜欢的颜色的按钮来设置，呃，超级最喜欢的颜色或其他东西。因此，点击 blanchedAlmond 按钮会更新文档，并添加值为masterColor的密钥blanchedAlmond。

活动：

'click button': function() {
    var masterColor = ????
    var docId = ????
    Meteor.call('setMasterColor', masterColor, docId)
  }

我可以提供HTML data - 包含颜色值的标记（因为事件中的this会吐出一些奇怪的数组，每个字母因某种原因而分开）甚至是_id与{{../_id}}，但感觉就像作弊，我真的想学习如何在帮助者或事件中做同样的事情。

我强烈认为Template.parentData()会出现这种情况，但在我console.dir时它根本不会返回任何内容。我该怎么办？

Answer 1

围绕parentData的混淆与事件上下文有关。该事件附加到模板，该模板的上下文不是人或颜色。每当您感觉需要开始使用data-属性乱丢代码时，答案几乎总是添加更多模板。例如：

<强> HTML

<template name="myTemplate">
  <ul>
    {{#each peopleList}}
      {{> person}}
    {{/each}}
  </ul>
</template>

<template name="person">
  <li>
    {{firstName}} {{lastName}}
    {{#each favoriteColors}}
      {{> color}}
    {{/each}}
  </li>
</template>

<template name="color">
  <button>{{this}}</button>
</template>

<强> JS

Template.color.events({
  'click button': function() {
    // this context is a color - remember to convert it to a string
    var masterColor = String(this);

    // the parent context is a person
    var docId = Template.parentData(1)._id;

    return Meteor.call('setMasterColor', masterColor, docId);
  }
});

如何在父数据上下文中访问文档的_id？

1 个答案: