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方法,但只有在渲染整个视图时才触发,我需要将这个插件应用于插入DOM的每个新项目.

所以,我的问题实际上可以用这样的方式表达 - 有没有办法获得对新插入的DOM元素的引用或在将新项添加到ArrayController并附加到DOM之后触发的任何回调？

Answer 1

我建议使用无块形式的{{each}}帮助器来指定每个元素使用的视图类.

<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();
  }
});