Angular Primeng 组件上的 ExpressionChangedAfterItHasBeenCheckedError

Question

我想问你一个关于我遇到的问题的问题：我目前正在处理一个使用 Primeng（14.2.2，但也有这个问题的 Angular 14）项目的 Angular（15，但也有这个问题）在 14.1.2)。 当我开始快速与之交互时（用鼠标单击或在焦点后按住 enter），问题是由任何 Primeng 下拉菜单引起的，这导致我出现此错误： dropdown error multiselect error

我真的不知道是什么导致了我的项目中的这个错误，我在我工作的另一个项目中没有遇到过它（使用 Angular 12.0.0 和 Primeng 13.3.3，但最近更新到 Angular 14 并且是根本没有显示这个问题）。 我尝试切换 Angular 和 Primeng 版本，但错误仍然存在。 有谁知道究竟是什么导致了这个问题？ 这可以修复吗？ 如果有人要给我答复，请提前致谢，如果需要，我很乐意添加更多信息

Answer 1

Angular 在更改检测完成后更改表达式值时抛出 ExpressionChangedAfterItHasBeenCheckedError。 Angular 仅在开发模式下抛出此错误。

在开发模式下，Angular 在每次更改检测运行后执行额外检查，以确保绑定没有更改。 这会捕获视图留在不一致 state 中的错误。例如，如果方法或 getter 每次调用时返回不同的值，或者子组件更改其父组件的值，就会发生这种情况。 如果发生其中任何一种情况，则表明变化检测不稳定。 Angular 抛出错误以确保数据始终正确反映在视图中，从而防止不稳定的 UI 行为或可能的无限循环。

当您添加了模板表达式或开始实施生命周期挂钩（如 ngAfterViewInit 或 ngOnChanges）时，通常会发生此错误。 在处理加载状态和异步操作时，或者当子组件更改其父绑定时，它也很常见。

点击阅读更多