Angular 角度变化检测器。detectChanges（）在*ngFor中断开matTooltip

以下组件中的matTooltip正在正确重新安装。工具提示的覆盖和小气泡将被渲染，但文本丢失（尽管在浏览器中检查时在html中），并且未正确定位

有趣的是，当我删除detectChanges（）调用时，工具提示会起作用，或者即使使用detectChanges（），工具提示也会在*ngFor之外起作用

@组件({
选择器：“mur应用标题栏”，
templateUrl:'./app titlebar.component.html'，
样式URL:['./app titlebar.component.scss']
})
导出类AppTitlebarComponent实现OnInit、OnDestroy{
公共应用程序项：IMenuItem[]；
private destroy$=新主题（）；
建造师(
私有appBarService:appBarService，//我的自定义服务
专用changeDetector:ChangeDetectorRef，
) {
}
公共ngOnInit（）{
this.appBarService.getAppbarItems（）.pipe（//可观察到的来自外部
takeUntil（此.destroy$）
).subscribe（值=>{
this.appbarItems=值| |[]；
//更改检测在显示值时不会自动触发
this.changeDetector.detectChanges（）；
});
}
公共恩格德斯特罗（）{
this.destroy$.next（）；
}
}

{{item.icon}
{{item.label}

---

我已经验证过，appbarItems只设置了一次，并且没有更改

通常，您不需要在Angular中的异步操作回调中调用

cdRef.detectChanges（）

但如果你这么做了，就意味着你在试图解决视图更新的一些问题。异步代码后未更新组件视图的原因可能有几个：

• 您的组件被隐藏，以便在OnPush更改检测策略下进行检查

• 回调在角度区域之外执行

看来你遇到了第二种情况。在Angular zone get之外调用cdRef.detectChanges会导致某些Angular处理程序在Angular zone之外注册的情况。因此，这些处理程序不会更新视图，您将在其他位置进行调用检测更改，或者再次使用zone.run

这里有一个这样的例子

您的解决方案可能是使用

ngZone将代码执行返回到角度区域。运行
方法：

import { NgZone } from '@angular/core';

constructor(private ngZone: NgZone) {}

.subscribe(value => {
  this.ngZone.run(() => this.appbarItems = value || []);
  

这似乎是一个异步操作问题。将您的
ngFor
移动到按钮中，使用
*ngIf=“appbarItems”
并删除
detectChanges
调用。或者将管道分配到属性并与
async
管道一起使用。您使用手动订阅而不是异步管道有特殊原因吗？能否在stackblitz中重现此问题？您确定在控制台中没有遇到任何其他错误吗？这似乎是由于某种原因导致渲染停止。另外，对于异步管道建议，为什么未触发更改检测？