[英]ExpressionChangedAfterItHasBeenCheckedError with ngClass
I have two anchor tags我有两个锚标签
<ul class="switchNav">
<li [ngClass]="!hidePanel2 ? 'active' : ''">
<a href="javascript:void(0)" (click) ="hideShowPanel(1)">panel 1</a>
</li>
<li [ngClass]="!hidePanel1? 'active' : ''">
<a href="javascript:void(0)" (click) ="hideShowPanel(2)">panel 2</a>
</li>
</ul>
.ts .ts
hidePanel2: boolean = true;
hidePanel1: boolean = false;
hideShowPanel(check: number) {
if (check == 1) {
this.hidePanel2 = true;
this.hidePanel1 = false;
}
else {
this.hidePanel1 = false;
this.hidePanel2 = true;
}
}
When I click on anchor tag it throws an error当我单击锚标记时,它会引发错误
ExpressionChangedAfterItHasBeenCheckedError
ExpressionChangedAfterItHasBeenCheckedError
It was working,but due to update any module by a team member it stopped working,它正在工作,但由于团队成员更新任何模块,它停止工作,
I have googled a lot but could not get it working我用谷歌搜索了很多,但无法让它工作
Please help请帮忙
Thanks谢谢
To add to Ritesh's answer, in this case you can do two things :要添加 Ritesh 的答案,在这种情况下,您可以做两件事:
setTimeout()
callbacksetTimeout()
回调中 -- ——
constructor(private changeDetector: ChangeDetectorRef) {
}
hideShowPanel(check: number) {
if (check == 1) {
this.hidePanel2 = true;
this.hidePanel1 = false;
}
else {
this.hidePanel1 = false;
this.hidePanel2 = true;
}
this.changeDetector.detectChanges();
}
I would also like to suggest an interesting article that explains what happens under the hood : Everything you need to know about ExpressionChangedAfterItHasBeenCheckedError我还想推荐一篇有趣的文章,它解释了幕后发生的事情: 您需要了解的有关 ExpressionChangedAfterItHasBeenCheckedError 的所有信息
Modify you method like this:像这样修改你的方法:
hideShowPanel(check: number) {
setTimeout( ()=> {
if (check == 1) {
this.hidePanel2 = true;
this.hidePanel1 = false;
}
else {
this.hidePanel1 = false;
this.hidePanel2 = true;
}
}, 0);
}
Basically, ExpressionChangedAfterItHasBeenCheckedError occurs when the change detection has run and after that the expression value gets modified.基本上,ExpressionChangedAfterItHasBeenCheckedError 在更改检测运行时发生,之后表达式值被修改。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.