Сделайте что-нибудь, когда ember будет делать обновления DOM

Я хочу делать вещи, когда привязки ember синхронизированы и DOM снова обновлен.

Я попытался с обратным вызовом от функции, которая управляет связанной моделью, DOM не обновляется при выполнении обратного вызова.

Я пытался с наблюдателем непосредственно на модели, DOM не обновляется, когда наблюдатель выполняется.

Я пытался с наблюдателем на привязке, DOM не обновляется, когда наблюдатель выполняется.

например

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», я обновляю модель, и когда модель обновляется и ее изменения отображаются, я хочу прокрутить вниз.

Ни один из способов, которые я пробовал, не смог получить новый scrollHeight. Он устанавливается через несколько мс после этих событий.

Вот пример для jsFiddle: http://jsfiddle.net/kcjzw/15/

Ответы на вопрос(2)

использованиеEmber.run.next

https://github.com/emberjs/ember.js/blob/master/packages/ember-metal/lib/run_loop.js#L531-566

App.view = Ember.View.extend({
    modelBinding: 'App.model',
    modelChanged : function() {
        Ember.run.next(myContext, function(){
            // code to be executed in the next RunLoop, which will be scheduled after the current one
            window.scrollTo(0, document.body.scrollHeight);
        });
    }.observes('model'),

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

Update

Взгляните на это:http://jsfiddle.net/ud3323/hZ7Vx/

Что вам нужно, это запустить ваш код после runloop, который отображаетEmber.CollectionView что{{each}} помощник создаст.

JavaScript:

App = Ember.Application.create();

App.model = Ember.Object.create({
    items: [1]
});

App.view = Ember.Handlebars.EachView.extend({
    contentBinding: 'App.model.items',

    itemViewClass: Ember._MetamorphView.extend({
        templateName: 'the_template'
    }),

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

    theAction: function(event) {
        App.controller.doStuffToModel();
    }
});

App.controller = Ember.Object.create({
    doStuffToModel : function() {
        App.model.set('items', [1,2,3,4,5]);
    }
});

Handlebars:

<script type="text/x-handlebars" data-template-name="the_template">
    <div style="height:200px;"></div> 
</script>

<script type="text/x-handlebars">
    {{view App.view}}
</script>​ 
 21 мая 2012 г., 17:41
Не могли бы вы создать jsFiddle, чтобы я мог увидеть полный рабочий пример того, что вы делаете? Ох и пользуйсяEmber.run.later вместоsetTimeout (начинается со строки 402 в файле run_loop.js, указанном выше).
 22 мая 2012 г., 20:02
Смотрите мое обновление выше.
 abaelter22 мая 2012 г., 10:18
Вот пример jsFiddle:http://jsfiddle.net/kcjzw/15/
 abaelter21 мая 2012 г., 17:29
Планирование работает, как и ожидалось, и закрытие выполняется как последняя вещь в моем коде. document.body.scrollHeight, однако, все еще отличается от того, что я получаю вsetTimeout(function() {console.log(document.body.scrollHeight);}, 2); (не 1 :))
 abaelter23 мая 2012 г., 09:34
Окей, спасибо! Но человек, который уродлив!
Решение Вопроса

Правильный способ сделать это задокументирован здесь:

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')
 17 окт. 2017 г., 09:20
Вот уже 3 дня стучит мне в голову. Так или иначе, это не появилось ни в одном из моих поисков. Это работает как шарм. Благодаря тонну :)

Ваш ответ на вопрос