4

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

  1. 与 ArrayController 关联的视图被插入到 DOM
  2. arrayController 内容已完全加载，通过存储

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

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

当我在didInsertElement方法之外设置观察者时，观察者在视图插入 dom 之前调用处理程序太快了。

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

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

4

3 回答 3

1

可能的答案：您可能会发现我的解决方案非常适合。这个想法是添加一个handlebars helper，当视图模板的一个子{{trigger}}部分被渲染时触发一个事件。例如，如果您的模板中已经有一个块，例如，您可以这样做：{{#if content.isLoaded}}

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

当数据显示时，你应该总是得到一个事件。由于车把模板已经很好地完成了这一点，我只是利用了它。

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

于 2013-01-11T09:08:12.030 回答
0

我相信 addObserver 的语法要求第二个参数是你的处理程序将被执行的上下文。

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

注意第二个参数是'this'。查看Observing Property Changes的文档

于 2013-10-29T11:38:26.327 回答
0

另一个提示而不是真正的解决方案，也许在 didInsertElement 中，观察者永远不会被调用，因为我认为它被错误地定义了。（我不知道它是否支持键链接）。我会做类似的事情：

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

如果可行，请不要忘记在 willDestroyElement 挂钩中删除此观察者

于 2013-01-11T00:21:18.650 回答