在 angular 中的 toastr 通知后呈现另一个页面

Question

我正在尝试在 toastr 通知消失后呈现导航另一个页面。

  showToasterWarning(){
    this.notifyService.showWarning("No Data Found for this Date!", "");
    
}

notifyService 是 toastr 的服务。

在我的代码中：

if(array == []){
this.showToasterWarning();
}

通知消失后意味着 4 或 5 秒后我想使用以下方式导航另一个页面：

this.router.navigate(..........);

只有toastr消失后我才想去另一个页面。

在 ngx-toastr 中有任何选项可以在通知消失后执行任何操作吗？

Answer 1

当 toastr 隐藏时，Ngx-toast 包为我们提供了一个 observable。

显示toastr后，您可以获取它的实例并使用“onHidden”属性。

    const toast = this.toastr.success('Hello!');
    toast.onHidden.subscribe(() => {
     console.log('Toast hidden');
     this.router.navigate(....)
    });

我在stackblitz

中做了一个例子

Answer 2

Please try this!

this.toastr.info('No Data Found for this Date!')
      .onHidden 
      .subscribe(() => this.router.navigateByUrl('......'));
})

在 angular 中的 toastr 通知后呈现另一个页面

render another page after toastr notification in angular

javascript

notifications

toastr

angular