Question

所以我知道如果我有以下html：

<template name="myTemplate">
  <ul>
    {{#each events}}
      <li>
        <h4 class="divEvent">{{title}}</h4>
      </li>
    {{/each}}
  </ul>
</div>

我可以使用以下事件侦听器访问事件的_id：

Template.myTemplate.events({
  'click li': function( event, template ){
    console.log( this._id );
  }
});

但如果我的html看起来像这样：

<template name="myTemplate">
  <ul>
    {{#each year in getYears}}
      <li>
        <h2>{{year}}</h2>
      </li>
      <ul>
        {{#each monthNumber in (getMonths year)}}
        <li>
          <h3>{{monthName monthNumber}}</h3>
        </li>
        <ul>
          {{#each event in (getEvents monthNumber year)}}
            <li class="eventLi">
              <h4>{{event.title}}</h4>
              <div>{{dayOfWeek event.start}}</div>
            </li>
          {{/each}}
        </ul>
      {{/each}}
    </ul>
{{/each}}

那么当我点击.eventLi时，如何访问事件的_id？

this._id对我没什么用......

我确信这是显而易见的，但我只是在学习这一切，而且我已经被困在这一段了一段时间。谢谢你的帮助！

Answer 1

使用Blaze时，解决此问题的简单模式通常是将循环中的部分放入单独的模板中，以便您可以明确地将事件附加到那里。（例如，您的模板有多个<li>标签）

而不是：

{{#each event in (getEvents monthNumber year)}}
  <li class="eventLi">
    <h4>{{event.title}}</h4>
    <div>{{dayOfWeek event.start}}</div>
  </li>
{{/each}}

有：

{{#each event in (getEvents monthNumber year)}}
  {{> oneEvent}}
{{/each}}

然后：

<template name="oneEvent">
  <li class="eventLi">
    <h4>{{event.title}}</h4>
    <div>{{dayOfWeek event.start}}</div>
  </li>
</template>

现在将您的活动附加到内部模板：

Template.oneEvent.events({
  'click li'( event, template ) {
    console.log( this._id );
  }
});

从spacebars #each循环中的模板事件侦听器访问_id

1 个答案: