首页 > 解决方案 > 默认情况下,ngx-toaster 在屏幕的错误位置通知

问题描述

这是 它在上面默认显示通知,也许它受到 CSS 属性的影响? 它在上面默认显示通知的问题,也许它受到 CSS 属性的影响?

当我像这样在模块的导入中配置位置时:

imports: [
  ...
  ...,
  ToastrModule.forRoot(
   positionClass: 'toastr-bottom-right'
  )
]

好吧,当我这样做时,它会将通知放在左上角,此外没有显示任何消息,正如您在屏幕截图中看到的那样,它只是一个红色(错误)toastr 通知但为空,即使我确实通过了当用户未正确登录时通知消息。

这是我的应用模块: 在此处输入图像描述

这是我的组件代码

export class NavComponent  {

  ...
  ...
  ...
  model: any = {};
  loggedIn: boolean;

  constructor(
    private accountService: AccountService, 
    private router: Router,
    private toastr: ToastrService
    ) { }
  ...
  ...
  login(){
      this.accountService.login(this.model).subscribe(response => {
        this.router.navigateByUrl('/agents');
      }, errorResponse => {
        console.log(errorResponse);
        this.toastr.error(errorResponse.eror);
      });
  }

我正在使用 Angular 10。

标签: javascriptcssangularangular10toastr

解决方案


在这里检查底部的拼写。

ToastrModule.forRoot({
    timeOut: 10000,
    positionClass: 'toast-bottom-right',
  }),

你可以忽略timeOut这里。


推荐阅读