Angular

Question

考虑一个 table，其中的行是动态构建的 - 即 HTML 元素包含一个 *ngIf 指令。

在不同的场合，我想将选定的 table 行滚动到视图中。因为这些是不同的场合，我需要完全构建 table 才能使其正常工作，所以我在 ngAfterViewChecked().

中执行滚动到视图操作

到目前为止，一切正常。现在，我在另一个组件上添加了一个 document.click 侦听器，不是 table，而是与 table:

在同一页面上的一个组件

  @HostListener('document:click')
  documentClick(): void {
    // do something
  }

这似乎在扰乱我滚动到视图中：例如，当单击一个按钮时，通常会将选定的 table 滚动到视图中，ngAfterViewChecked() 执行两次，第二次, 但是，执行了此函数中错误的 if 块。

我想知道，是否可以通过某种方式检查 ngAfterViewChecked() 是否被 document.click 事件调用，以便我可以在额外的 if 块中处理此事件？

我也愿意接受其他建议。

Answer 1

如果您想在页面初始化时滚动到 table 行，您可以在 AfterViewInit 生命周期挂钩中进行滚动。

由于生命周期挂钩链，每次更改检测都会调用 ngAfterViewChecked()。

此外，您可以执行滚动侦听单击或其他选择 table 行的事件。

Angular - 我怎么知道哪个操作调用了 ngAfterViewChecked()？