【发布时间】：2017-10-21 22:25:40
【问题描述】：
来自ngAfterViewInit 的角度文档
ngAfterViewInit()
Angular 初始化组件后响应 视图和子视图。
在第一个 ngAfterContentChecked() 之后调用一次。
只有组件的钩子。
我有一个组件 C 嵌套在组件 T
中组件 C 实现了以下钩子。
ngAfterViewInit(): void {
console.log("afterViewInit");
debugger;
}
组件 T 是一个表格 - 每当用户单击一个单元格时，都会对其进行更改检测。
组件C可以在表格单元格中找到。
当我单击单元格时，我可以看到afterViewInit 登录到控制台。
我的堆栈跟踪如下：
DynamicComponentWrapper.ngAfterViewInit （动态组件包装器.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。
【问题讨论】：
-
这是由 Angular 变化检测策略引起的。如果进行了更新，它会检查您的整个组件。您可以尝试更改检测策略，但这取决于您如何在组件之间进行绑定。最好的方法是使用带有哑/智能组件的清晰输入/输出。如果您依赖路由器插座并且无法使用输入/输出，那么您应该能够在没有
ngAfterViewInit的情况下使用您想要的东西并使用服务来管理您的数据。 -
@AlexBeugnet 我对
ChangeDetectionStrategy.OnPush进行了试验，但无济于事 - 当没有输入更改时仍会触发更改检测。
标签： angular