Angular 5 材质小吃栏仅针对自定义 ErrorHandling 无法正确显示,否则它可以正常工作
Posted
技术标签:
【中文标题】Angular 5 材质小吃栏仅针对自定义 ErrorHandling 无法正确显示,否则它可以正常工作【英文标题】:Angular 5 material snackbar is not showing correctly for custom ErrorHandling only, otherwise it works fine 【发布时间】:2018-10-26 15:04:34 【问题描述】:Angular 5 材质,材质小吃栏仅针对自定义 ErrorHandling 无法正确显示,否则可以正常工作:
我正在尝试使用材料小吃栏显示我的后端错误,问题是它第一次被触发时,它出现在错误的位置(不是应该的底部中间,而是在左侧)并且它停留在那里永远不会消失(根据我的配置,它应该会在 2 秒后自动消失)
下次出现时,它将正确出现并在 2 秒后消失。
请在此处尝试该问题: stackblitz example showing my issue.
The stackblitz code is here
谢谢
【问题讨论】:
【参考方案1】:我花了很长时间才找到答案,我不太确定为什么它会这样,但它确实有效,所以我希望它可以帮助其他人。
在ErrorHandler中调用materialsnackbar时,我们必须使用一个叫做NgZone的东西(我认为是由于在Angular中以某种特殊方式调用了ErrorHandler)
所以调用snackbar的代码应该是:
constructor(private matSnackBar: MatSnackBar, private zone: NgZone, private dataService: DataService)
notify (message: string)
this.zone.run(() =>
this.matSnackBar.open(message, '' ,
duration: 2000
);
);
Updated Stackblitz that is now working
【讨论】:
感谢您的投票,也许您也可以为这个问题投票,因为它对您很有用,干杯以上是关于Angular 5 材质小吃栏仅针对自定义 ErrorHandling 无法正确显示,否则它可以正常工作的主要内容,如果未能解决你的问题,请参考以下文章
如何在 Angular 5 的 Angular 材质 Snackbar 中添加图标
使用 Angular 材质定义自定义主题时出现 SassError