ember.js - Emberjs - 如何在访问其子级之前等到模板完全呈现

Question

有没有办法等到模板完全呈现后再通过视图访问其子级，例如使用 jquery？

didInsertElement 对我来说似乎没有按预期工作。在模板完全构建之前，我需要添加额外的半秒延迟。模板遍历控制器中的数组并创建多个 div。即使我覆盖了 didInsertElement，也无法立即访问这些 div。

Answer 1

我最近在 Ember 中添加了一些更优雅的东西：afterRender队列。请参阅此提交，特别是使用示例的测试。

Answer 2

我不知道您如何插入这些子视图，但一种方法如下：

didInsertElement: function(){
  if (this.$().find(".myAwesomeChildViews").length > 0) {  // <-- adapt this to your needs
     // my childViews are inserted
  } else {
     Ember.run.next(this, function() {
        this.didInsertElement();
     });
  }
}

这里重要的是 didInsertElement() 将一直​​被调用，直到检查结果为真。

---

更好的是，您可以将其重构如下：

Ember.View.reopen({
    didInsertElement: function() {
        this._super();
        this.setIsRendered();
    },

     setIsRendered: function() {
        if (!!this.$()) {
            this.set('isRendered', true);
        } else {
            Ember.run.next(this, function() {
                this.setIsRendered();
            });
        }
    },
});

然后在你看来：

App.MyView = Ember.View.extend({
   areMyChildViewsRendered: function() {
      return this.get('childViews').everyProperty('isRendered');
   }.property('chilViews.@each.isRendered')
});