emberjs如何在模型加载后触发jquery效果

Question

我开始使用 Emberjs :) 我正在尝试使用淡入淡出的 jquery 效果显示模型中的图片

$('.ember-view img').load( ->
  $(this).fadeIn(10000).show()
).each( ->
  $(this).load() if(this.complete) 
)

我尝试了不同的方法来找到触发此事件的好地方，但我无法找到创建触发此事件的方法的好地方

我有这条路线

MyApp.SquaresRoute = Ember.Route.extend(
 setupController: (controller) ->
   controller.set('model', @store.find('sqimage'))

我还有 2 个控制器（数组和对象）

MyApp.SquaresController = Ember.ArrayController.extend

MyApp.SquareController = Ember.ObjectController.extend

以及我渲染对象的模板

 {{#each controller}}
    <img {{bind-attr src="url_thumbnail"}} {{bind-attr style="style"}} />
{{/each}}

我尝试在视图文件中放置一个 didInsertElement，但没有成功。

我应该使用观察者吗？我应该把它放在哪里？

感谢您的回答！

Answer 1

我会尝试为您的每个收藏项使用单独的视图。代码应如下所示：

您收藏的车把模板：

{{#each item in controller}}
    {{view App.ItemView context=item}}
{{/each}}

您的 ItemView 的把手模板：

<img {{bind-attr src="url_thumbnail"}} {{bind-attr style="style"}} />

并在 Views didInsertElement 钩子中做 jquery 效果：

App.YourView = Ember.View.extend({
  // these are two different styles to use the 'didInsertElement' hook. Choose the one you prefer
  didInsertElement : function(){
    this.$().find('img').fadeIn(10000);
  },
  yourEffectFunction : function(){
    this.$().find('img').fadeIn(10000);
  }.on("didInsertElement")
});

请注意：我不太明白您的 jquery 代码应该做什么。因此，只需将视图中的逻辑替换为所需的代码即可。