在 Ember.js 中完全呈现所有视图后执行一次代码答案

【问题标题】：Execute code once after all views have completely rendered in Ember.js在 Ember.js 中完全呈现所有视图后执行一次代码
【发布时间】：2013-08-04 22:49:14
【问题描述】：

类似于文档准备好的东西，但在所有 Ember 视图渲染之后

我现在正在通过覆盖 ApplicationView didInsertElement 来执行此操作，到目前为止它似乎正在工作：

App.ApplicationView = Em.View.extend({
  didInsertElement: function() {
    // Do your magic.
  }
});

我想知道这是否是准备 Ember 文档的正确方法，或者 Ember 是否对这个简单且非常常见的东西有更原生的支持。

【问题讨论】：

标签： ember.js

【解决方案1】：

您可以通过重新打开基本 View 类并将其添加到渲染队列中来轻松添加“渲染后”挂钩。

这里有一些代码告诉你如何做：

Ember.View.reopen({
    didInsertElement : function() {
        this._super();
        Ember.run.scheduleOnce('afterRender', this, this.didRenderElement);
    },
    didRenderElement : function() {
        // Override this in your View's
    }
});

【讨论】：

这是朝着正确方向迈出的一步。目前，我正在尝试在任何转换或刷新后在页面渲染上运行 javascript。我尝试将我的 jquery 块放入 willTransition、didTransition 以及应用程序路由中的 before 和 afterModel 挂钩，但没有成功。有什么想法吗？

【解决方案2】：

didInsertElement 是正确的位置，但如果您想完全确定您的渲染队列已完全刷新，您还可以监听 afterRender 事件，如下所示：

App.ApplicationView = Ember.View.extend({
  didInsertElement: function() {
    Ember.run.scheduleOnce('afterRender', this, 'processChildElements');
  },

  processChildElements: function() {
    // do here what you want with the DOM
  }
});

希望对你有帮助。

【讨论】：

实际上，ApplicationView 似乎不是正确的位置，它适用于第一个请求，但是当您在此之后开始渲染其他模板时，钩子不会触发。我在渲染后要执行代码的特定视图上定义了 didInsertElement，效果很好，但是如果 Ember 在每次转换后都有一个通用的钩子来处理所有视图，那就太好了。
@clueless，你提到了$(document).ready 所以是的ApplicationView 是第一个请求，对于所有其他视图，你需要做同样的事情，我猜你已经评论过。据我所知，当所有视图都被渲染时，没有内置的钩子。
@clueless $(document).ready 没有等价物，因为这会导致全局意大利面条代码。您应该将您的 jQuery 逻辑放入最适合任务的视图中。

【解决方案3】：

App.ApplicationView = Ember.View.extend({
  afterRender: function () {
    Ember.run.next(this, function () {
      // This will run one time, after the full initial render.
    });
  }
});

【讨论】：