angular - ngAfterContentChecked 和 ngAfterViewChecked 在第二个事件之后才显示正确的值

Question

我有 angular 2 代码，它显示一个带有多个字段的网格，每个字段都有一个过滤器。我想显示运行过滤器时返回的项目数。我通过计算屏幕上当前的行数来做到这一点，并在它发生变化时使用 ngAfterViewChecked() 来获取该数字。我面临的问题，正确的数字仅在第二个事件发生后显示。例如，在下图中，过滤器返回了 1 个项目，但它显示“总共显示 13 个用户中的 11 个用户”。但是，如果我单击鼠标或按下将其更改为“总共显示 13 个用户”的键。我也尝试过使用 ngAfterContentChecked()

ngAfterViewChecked() : void {

        this.numOfUsersOnPage = document.getElementsByClassName("ui-datatable-even").length;
        this.changeDetection.detectChanges();

}

<div class="grid-padding">
        <span *ngIf="showNumOfUser"> Showing {{numOfUsersOnPage}} users of {{totalNumOfUsers}} in total </span>
</div>

标签： angularangular-grid