ember.js - 仅在插入 View 并加载内容时才执行处理程序

Question

当满足两个条件时，我需要执行一个处理程序:

与 ArrayController 关联的 View 被插入到 DOM 中

arrayController 内容完全加载，通过存储

我试图在 controller.isLoaded 上添加一个观察者属性(property)在 didInsertElement但观察者处理程序永远不会被调用。

didInsertElement: function() {
    this.addObserver('controller.isLoaded', function() {
        console.info('inserted the element and store is loaded');
    });
},

当我在 didInsertElement 之外设置观察者时方法，观察者在将 View 插入 dom 之前过早地调用处理程序。

handler: function() {        
    var content, controller = this.get('controller');
    console.info(controller.get('content').get('isLoaded'));
}.observes('controller.isLoaded')

另外，我不明白为什么上述场景中的处理程序被调用两次，并且每次 controller.get('content') 显示一个空数组

Answer 1

可能的答案:您可能会找到 my solution here很合身。这个想法是添加一个 {{trigger}}当 View 模板的一个子部分被渲染时触发一个事件的handlebars helper。例如，如果您的模板中已经有一个块，例如 {{#if content.isLoaded}} ， 你可以这样做:

{{#if content.isLoaded}}
    {{#each content}}
        ...
    {{/each}}
    {{trigger contentDidRender}}
{{else}}
    <p>Loading...</p>
{{/if}}

并且您应该始终在数据显示时收到一个事件。由于 Handlebars 模板已经很好地完成了这一点，我只是利用了它。

至于为什么您尝试过的事情有问题，您可能在 View 显示和内容加载之间存在竞争条件(未定义可能首先发生) - 即您可能在 isLoaded 上添加了观察者在它已经加载之后，因此您没有观察到变化。并注意(我认为)一个 observes每次设置观察到的属性时都会调用处理程序，而不是每次更改时都会调用处理程序......所以它可能被设置了两次，但两次都设置为 false。