在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：

中，会发生什么

只有在呈现缓存用户（我）时才会触发一次。此表中的空单元格会在其余的用户信息被填入后几毫秒填充，但updateTable永远不会重新运行。

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

帮助

有没有办法在渲染完所有对象后触发事件？我使用了this answer中提到的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')

希望它有所帮助！