angular 项目出现错误："Expression has changed after it was checked"
0
悬赏园豆：30
[已解决问题]
解决于 2025-05-29 16:47
升级到 angular 19 的项目，下面的代码在运行时报错
<ng-container *ngIf="selectType === 'custom'">
<tr *ngFor="let post of selectedPosts.values()">
<td><a [href]="post.url" target="_blank">{{ post.title }}</a></td>
<td>{{ postTypeConverter.toDisplayName(post.postType) }}</td>
<td>{{ post.viewCount }}</td>
<td>{{ post.feedBackCount }}</td>
</tr>
</ng-container>
报错信息如下
NG0100: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: '[object Map Iterator]'. Current value: '[object Map Iterator]'
selectedPosts 的类型定义
selectedPosts: Map<number, BlogPostModel> = new Map<number, BlogPostModel>();
最佳答案
0
在 selectedPosts 的值被修改后手动触发 change detection 即可解决
this.changeDetectRef.detectChanges();
参考：
验证时弄错了，上面的方法没有解决问题
改为用 signals ，问题依旧
selectedPosts = signal(new Map<number, BlogPostModel>());
在 signal 中保存 Map，需要注意 Map 相等比较的问题，详见：
最后通过将 component 的 ChangeDetectionStrategy 设置为 OnPush 解决了
changeDetection: ChangeDetectionStrategy.OnPush
采用 OnPush 后很多地方需要加 detectChanges
this.changeDetectRef.detectChanges();
于是，干脆改为全部使用 signals
