每次更改检测后都会调用 Angular ngAfterViewInit

Question

来自 ngAfterViewInit 的 Angular 文档

ngAfterViewInit()

Respond after Angular initializes the component's views and child views.

Called once after the first ngAfterContentChecked().

A component-only hook.

我有一个组件 C 嵌套在组件 T

中

组件 C 实现了以下钩子(Hook)。

ngAfterViewInit(): void {
        console.log("afterViewInit");
        debugger;
    }

组件 T 是一个表 - 每当用户单击一个单元格时，都会对其进行更改检测。

组件 C 可以在表格单元格中找到。

每当我单击该单元格时，我都可以看到 afterViewInit 登录到控制台。

我的堆栈跟踪如下:

DynamicComponentWrapper.ngAfterViewInit (dynamic-component-wrapper.ts:72) View_TableComponent18.detectChangesInternal (/TableModule/TableComponent/component.ngfactory.js:904) AppView.detectChanges (view.js:425) DebugAppView.detectChanges (view.js:620) ViewContainer.detectChangesInNestedViews (view_container.js:67) View_TableComponent17.detectChangesInternal (/TableModule/TableComponent/component.ngfactory.js:962) AppView.detectChanges (view.js:425) DebugAppView.detectChanges (view.js:620) ViewContainer.detectChangesInNestedViews (view_container.js:67) View_TableComponent15.detectChangesInternal (/TableModule/TableComponent/component.ngfactory.js:1043) AppView.detectChanges (view.js:425)

问题

是什么导致在父更改时调用 ngAfterViewInit？组件是否正在重新呈现 - 即 - 从 DOM 中删除并替换？

我该如何预防呢？ - 即 - 我如何确保 ngAfterViewInit 只被调用一次

更新:在将 Component C 和 Component T 都更改为使用 ChangeDetectionStrategy.OnPush 之后，afterViewInit 仍然会在任何更改时被调用。

Answer 1

这可能是由于一些外部指令与子组件一起使用，您提到的组件的值也与这些指令绑定(bind)。

相关文章:

Angular 7: ChangeDetectorRef detectChanges() causes infinite loop when called from inside a subscription