材料小吃吧的角度误差

前端之家收集整理的这篇文章主要介绍了材料小吃吧的角度误差前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
在我的角度4项目中,我实施了一些 MatSnackbar
用户展示一些有用的信息.
除了一个案例外,所有小吃都很好用……

用户尝试访问应用程序但令牌已过期时,我的身份验证保护将用户重定向登录页面显示快餐栏,
这个零食吧似乎运作良好但在控制台我可以看到这个错误

MatSnackBarContainer_Host.html:1 ERROR Error:
ExpressionChangedAfterItHasBeenCheckedError: Expression has changed
after it was checked. PrevIoUs value: ‘undefined’. Current value:
‘visible-bottom’. It seems like the view has been created after its
parent and its children have been dirty checked. Has it been created
in a change detection hook ?
at viewDebugError (core.es5.js:8434) [angular]
at expressionChangedAfterItHasBeenCheckedError (core.es5.js:8412) [angular]
at checkBindingNoChanges (core.es5.js:8576) [angular]
at checkNoChangesNodeInline (core.es5.js:12455) [angular]
at checkNoChangesNode (core.es5.js:12429) [angular]
at debugCheckNoChangesNode (core.es5.js:13209) [angular]
at debugCheckRenderNodeFn (core.es5.js:13149) [angular]
at Object.eval [as updateRenderer] (MatSnackBarContainer_Host.html:1) [angular]
at Object.debugUpdateRenderer [as updateRenderer] (core.es5.js:13131) [angular]
at checkNoChangesView (core.es5.js:12251) [angular]
at callWithDebugContext (core.es5.js:13493) [angular]
at Object.debugCheckNoChangesView [as checkNoChangesView] (core.es5.js:13040) [angular]
at ViewRef_.webpackJsonp…/../../core/@angular/core.es5.js.ViewRef_.checkNoChanges
(core.es5.js:10197) [angular]
at vendor.bundle.js:92838:67 [angular] View_MatSnackBarContainer_Host_0 @ MatSnackBarContainer_Host.html:1
MatSnackBarContainer_Host.html:1 ERROR CONTEXT DebugContext_

登录页面的ngOnInit中,我显示了快餐栏:

ngOnInit() {


    if (this.route.snapshot.queryParams['returnUrl']) {
      this.openSnackBar(('token expired'));
    }
}

openSnackBar(message: string,action?: string) {
    return this.snackBar.open(message,action,{
      duration: 3000,});
  }

我该如何解决这个错误

解决方法

这不是重大问题:这是一个生命周期问题.

如果您不知道,Angular将遵循生命周期,在该生命周期中,他检查更改,分配变量等.

在你的情况下,他告诉你,在将变量标记为已检查后,你已经改变了变量的值,并且它与他混淆了.您可以在错误中看到新值:

visible-bottom

这意味着你的代码中的某个地方,你做了一个

this.myVar = 'visible-bottom';

要纠正此错误,只需将其包围在超时内即可

setTimeout(() => this.myVar = 'visible-bottom');

这将告诉Angular

I know you have checked my variable,but I need to change its value,so restart your change detection please

猜你在找的Angularjs相关文章