在Ember.js中，为什么'afterRender'不会触发重绘？

Question

我正在尝试在将新数据添加到视图中的表时调用函数，但它不起作用。 我正在使用Ember.js 2.5

我有两个模型，客户端和用户。 客户有很多用户。

我列出客户端的视图如下所示：

<table class="table table-striped" id="admin-table">
  <thead>
    <tr>
      <th>Primary User</th>
      <th>User Email</th>
      <th>Join Date</th>
    </tr>
  </thead>
  <tbody>
    {{#each model as |client|}}
      <tr>
        <td>{{client.primaryUser.name}}</td>
        <td>{{client.primaryUser.email}}</td>
        <td>{{client.createdAt}}</td>
      </tr>

    {{/each}}
  </tbody>
</table>

primaryUser是一个计算属性，包含每个客户端的第一个用户。

  primaryUser: Ember.computed('users', function(){
    return this.get('users.firstObject');
  })

问题

我正在使用jquery tablesorter库，它为表添加了排序和过滤。 因为AJU加载了primaryUser get，所以我需要在添加新数据时调用$('#admin-table').trigger('update') ，以便让库索引新信息。

这是我正在做的事情：

  modelObserver: function() {
    Ember.run.next(this, this.updateTable);
  }.observes('model.@each.primaryUser')

我已经尝试了run.next和run.scheduleOnce('afterRender'..) ，结果总是一样的。 该updateTable功能触发所有primaryUser对象的呈现之前。

如果我在this.updateTable放置一个调试器，会发生什么：

它只会在呈现缓存用户（我）时触发一次。 空单元格本表中填充几毫秒后，当用户信息的其余ajaxed中，但updateTable永不再运行。

我现在可以确认其他主要用户字段不在DOM中：

救命

有没有办法在渲染所有对象后触发事件？ 我已经使用了这个答案中提到的Ember.run.sync() ，但它没有帮助。

Answer 1

一切都很好，但你需要手动检查是否所有用户都被渲染。 别无选择。 我认为代码看起来像这样。 它有点原始，但我认为你可以理解你可以检查DOM。

modelObserver: function() {
    var areRendered = [];
    Ember.$('table#admin-table tr').each(function (index, element) {
        $(element).find('td').each(function (anotherIndex, anotherElement) {
            if (anotherIndex <= 1) { //This is because according to your screenshot you don't have to check all the cells, just first two if I'm not mistaking.
                if (anotherElement.text()) {
                    areRendered.push(true);
                } else {
                    areRendered.push(false);
                }
            }
        });
    });
    if (!areRendered.contains(false)) { //Checking if there were any element without data.
        Ember.run.next(this, this.updateTable);
    }
}.observes('model.@each.primaryUser')

希望能帮助到你！