有没有一种方法可以对所有消息仅使用一个p-toast?

时间:2020-08-06 02:50:54

标签: angular primeng toast

我正在使用Primeng p-toast显示消息。

我将p-toast html放入了app.component.html

<div class="main-container">
  <router-outlet></router-outlet>
</div>
<p-toast position="top-right" key="main"></p-toast>

并将ToastModule和MessageService导入sharedModule中,以便任何组件都可以使用它。

试图在许多子组件上使用此功能显示消息,但未显示

this.messageService.add({
          key: "main",
          severity: "info",
          detail: "Ready to scan",
        });

我仍然必须在孩子的html中添加p-toast html才能使其正常工作。

子组件通过app-routing.module加载

const routes: Routes = [
  { path: "", component: HomeComponent },
  {
    path: "catalogs",
    loadChildren: () =>
      import("./catalog/catalog.module").then((m) => m.CatalogModule)
  }];

@NgModule({
  imports: [
    RouterModule.forRoot(routes)
  ],
  exports: [RouterModule],
})
export class AppRoutingModule {}

有没有一种方法只能声明一个,并且调用messageService.add的子组件可以在该p-toast上显示消息?

1 个答案:

答案 0 :(得分:1)

我已经通过@yurzui解决了这个问题

以前,ToastModule和MessageService是在SharedModule中导入的,这样我就不必重复将内容导入我创建的其他模块中。

我刚刚将ToastModule和MessageService导入从SharedModule移至AppModule 因为<p-toast>仅在app.component.html