当 ember 完成 DOM 更新时做一些事情 [英] Do something when ember is done with DOM updates

问题描述

我想在 ember 绑定同步并且 DOM 再次更新时做一些事情.

I want to do stuff when ember bindings have synchronized and the DOM is again up to date.

我尝试从操作绑定模型的函数中调用回调，执行回调时 DOM 不会更新.

I have tried with a callback from the function that manipulates the binded model, DOM is not updated when callback is executed.

我已经尝试过直接在模型上使用观察者，执行观察者时 DOM 不会更新.

I have tried with an observer directly on the model, DOM is not updated when the observer is executed.

我尝试在绑定上使用观察者，执行观察者时 DOM 不会更新.

I have tried with an observer on the binding, DOM is not updated when the observer is executed.

例如

App.view = Ember.View.extend({
    modelBinding: 'App.model',
    modelChanged : function() {
        window.scrollTo(0, document.body.scrollHeight);
    }.observes('model'),

    getMore: function(event) {
        App.set('model', "somethingnew");
    }
});

当我触发gotMore"时，我更新模型，当模型更新并呈现其更改时，我想向下滚动.

When I fire the "gotMore", I update the model, and when the model is updated and its changes have been rendered I want to scroll down.

在我尝试过的所有方法中，我都无法获得新的 scrollHeight.设置在这些事件之后几毫秒.

In none of the ways I've tried have I been able to get the new scrollHeight. It is set a few ms after these events.

这是一个关于 jsFiddle 的例子:http://jsfiddle.net/kcjzw/15/

Here's an example on jsFiddle: http://jsfiddle.net/kcjzw/15/

推荐答案

此处记录了正确的方法:

The correct way to do this is documented here:

http://emberjs.com/api/classes/Ember.run.html#method_next

modelChanged : function() {
  Ember.run.scheduleOnce('afterRender', this, function() {
    window.scrollTo(0, document.body.scrollHeight);
    $('body').append('New scroll height: '+document.body.scrollHeight);
  });
}.observes('content')

这篇关于当 ember 完成 DOM 更新时做一些事情的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！