ember.js - 在 Ember.CollectionView 渲染结束时运行 jquery

标签 ember.js

我有一个ContainerView,其中包含一个CollectionView。在这个 CollectionView 在屏幕上渲染之后,我需要执行一个 jquery 函数,该函数本质上是查看渲染模板的内容并执行一些显示修改。

如果我在CollectionViewdidInsertElement中执行该jquery,它会起作用,但它会针对CollectionView中的每个元素执行,因为我实际上只需要在最后完成一次。我该如何指定?

http://jsfiddle.net/JFqNr/ (注意不会在 jsfiddle 或某些原因上渲染,只是为了向您展示结构)

App = Ember.Application.create();

App.FooContainerView = Ember.ContainerView.extend({
    childViews: ['elementList'],    

    elementList: Ember.CollectionView.extend({
        content: function() {
            return [
                { Title: "Dashboard", ID: "dashboard" },
                { Title: "Invoices", ID: "invoices" },
                { Title: "Expenses", ID: "expenses" },
                { Title: "People", ID: "people" },
                { Title: "Reports", ID: "reports" },
                { Title: "Settings", ID: "settings" }
            ];
        }.property(),        
       template: Ember.Handlebars.compile( '{{view.content.title}}' ),

       didInsertElement: function() {
             // perform jquery function            
       }
    }),

   didInsertElement: function() {
         // does not work if perforemed here
   }    
});

App.initialize();
​

最佳答案

执行此操作的功能最近才添加到 master 分支,因此您需要编译自己的 Ember 版本。
您现在可以安排到 afterRender 队列中,以便在渲染所有单个 View 后运行。

App.FooContainerView = Ember.ContainerView.extend({
  // Existing code
  didInsertElement: function() {
    Ember.run.scheduleOnce('afterRender', this, function(){
      // perform jQuery function here;
    });
 }

参见https://github.com/emberjs/ember.js/pull/1528了解代码详细信息。

关于ember.js - 在 Ember.CollectionView 渲染结束时运行 jquery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13538021/

相关文章:

ember.js - ApplicationRoute 的加载状态

javascript - Ember.js 需要有关简单 Todo 示例的集合处理程序的帮助

ember.js - ember.js 中的嵌套资源,向带有夹具数据的帖子添加评论

json - 如何在 ember 中序列化简单数组有效负载?

javascript - 断言失败 : The value that #each loops over must be an Array error. 我做错了什么?

ember.js - 在 application.hbs 中包含另一个模板

ember.js - Ember-Data 如何知道何时获取实体

ember.js - 在 ember.js 中为 'site header' 使用组件与部分

ember.js - 如何使用排序属性: ['lastName' ]

javascript - TinyMCE Javascript WYSIWYG 编辑器无法与 Ember js 一起使用