javascript - Ember.js:如何在新项目插入 ArrayController 后应用 jquery 插件

Question

所以我有一个以非常标准的方式呈现的 ArrayController:

<ul>
  {{#each controller}}
     <li>{{ user.name }} : {{message}} <abbr class="timeago" title="{{unbound datetimeFormatted}}">{{unbound datetimeFormatted}}</abbr></li>
  {{/each}}
</ul>

我想要的是在插入新项目后应用 jQuery.timeAgo 插件，但为此我应该以某种方式获取对插入元素的引用。

我尝试了 didInsertElement 方法，但它仅在呈现整个 View 时触发，我需要将此插件应用于插入到 DOM 中的每个新项目。

所以，我的问题真的可以这样表述——有没有什么方法可以获取对新插入的 DOM 元素的引用，或者在新项目添加到 ArrayController 并附加到 DOM 后触发的任何回调？

Answer 1

我建议使用 {{each}} 助手的无 block 形式来指定每个元素要使用的 View 类。

<ul>{{each controller itemViewClass="App.AnItemView"}}</ul>

然后像这样定义 App.AnItemView:

App.AnItemView = Ember.View.extend({
  template: Ember.Handlebars.compile('{{ user.name }} : {{message}} <abbr class="timeago" title="{{unbound datetimeFormatted}}">{{unbound datetimeFormatted}}</abbr>'),
  didInsertElement : function(){
    this.$().timeago();
  }
});