简体繁体 English

Angular Primeng 组件上的 ExpressionChangedAfterItHasBeenCheckedError

[英]Angular ExpressionChangedAfterItHasBeenCheckedError on Primeng Components

原文 2022-11-22 09:55:42 5 1 angular/ expression/ primeng

i'd like to ask you a question about the issue i am experiencing: I'm currently working on an Angular (15, but also had this problem on Angular 14) project that uses Primeng (14.2.2, but also has this problem on 14.1.2).我想问你一个关于我遇到的问题的问题：我目前正在处理一个使用 Primeng（14.2.2，但也有这个问题的 Angular 14）项目的 Angular（15，但也有这个问题）在 14.1.2)。 The problem is caused by any Primeng dropdown when i start interacting with it quickly (clicking with my mouse or holding enter after focus), this causes me this error: dropdown error multiselect error当我开始快速与之交互时（用鼠标单击或在焦点后按住 enter），问题是由任何 Primeng 下拉菜单引起的，这导致我出现此错误： dropdown error multiselect error

I don't really know what is actually causing this error in my project, i didn't experience it in another project i worked on (that used Angular 12.0.0 and Primeng 13.3.3, but recently got updated to Angular 14 and is not showing this problem at all).我真的不知道是什么导致了我的项目中的这个错误，我在我工作的另一个项目中没有遇到过它（使用 Angular 12.0.0 和 Primeng 13.3.3，但最近更新到 Angular 14 并且是根本没有显示这个问题）。 I tried switching Angular and Primeng versions, but the error persisted.我尝试切换 Angular 和 Primeng 版本，但错误仍然存在。 Does anyone know what is actually causing this problem?有谁知道究竟是什么导致了这个问题？ Can this be fixed?这可以修复吗？ Thanks in advace if anyone is going to give me a reply, i'll be happy to add further information if needed如果有人要给我答复，请提前致谢，如果需要，我很乐意添加更多信息

1 个解决方案

Angular throws an ExpressionChangedAfterItHasBeenCheckedError when an expression value has been changed after change detection has completed. Angular 在更改检测完成后更改表达式值时抛出 ExpressionChangedAfterItHasBeenCheckedError。 Angular only throws this error in development mode . Angular 仅在开发模式下抛出此错误。

In development mode, Angular performs an additional check after each change detection run, to ensure the bindings haven't changed.在开发模式下，Angular 在每次更改检测运行后执行额外检查，以确保绑定没有更改。 This catches errors where the view is left in an inconsistent state. This can occur, for example, if a method or getter returns a different value each time it is called, or if a child component changes values on its parent.这会捕获视图留在不一致 state 中的错误。例如，如果方法或 getter 每次调用时返回不同的值，或者子组件更改其父组件的值，就会发生这种情况。 If either of these occurs, this is a sign that change detection is not stabilized.如果发生其中任何一种情况，则表明变化检测不稳定。 Angular throws the error to ensure data is always reflected correctly in the view, which prevents erratic UI behavior or a possible infinite loop. Angular 抛出错误以确保数据始终正确反映在视图中，从而防止不稳定的 UI 行为或可能的无限循环。

This error commonly occurs when you've added template expressions or have begun to implement lifecycle hooks like ngAfterViewInit or ngOnChanges.当您添加了模板表达式或开始实施生命周期挂钩（如 ngAfterViewInit 或 ngOnChanges）时，通常会发生此错误。 It is also common when dealing with loading status and asynchronous operations, or when a child component changes its parent bindings.在处理加载状态和异步操作时，或者当子组件更改其父绑定时，它也很常见。

Click to read more点击阅读更多