PrimeNG 烤面包机未显示 - Angular 6答案

【问题标题】：PrimeNG Toaster not showing - Angular 6PrimeNG 烤面包机未显示 - Angular 6
【发布时间】：2019-03-29 19:34:36
【问题描述】：

我正在尝试实现 PrimeNG 烤面包机，但它没有出现，不确定我缺少什么。我按照这样的步骤操作：

npm install primeng --save
npm install primeicons --save

我在 angular-cli 样式中添加了以下内容：

"node_modules/primeicons/primeicons.css",
"node_modules/primeng/resources/themes/nova-light/theme.css",
"node_modules/primeng/resources/primeng.min.css"

在我导入的 app.module.ts 中

ToastModule,
BrowserAnimationsModule

在提供者中，我有来自 primeng/api 的 MessageService。

现在，在我的 http 请求服务中，我添加了这段代码：

get(url: string, showSuccessToast?: boolean, toastMessage?: string) {
        const result = this.http.get(url)
            .pipe(map((response: Response) => {

                    if (showSuccessToast) {
                        this.messageService.add({severity: 'success', summary: 'Success!', detail: toastMessage});
                    }
                    return response;
                }),
                catchError(response => this.handleError(response))
            );

        return result;
    }

在我发出 get 请求的组件服务中，我为 showSuccess 添加了 true，为 message 添加了一个字符串。

在app.component.ts我加了：<p-toast></p-toast>

没有抛出错误，烤面包机只是没有弹出......

【问题讨论】：

尝试删除 showSuccessToast 条件并在返回响应时仅显示 toast
@Roj 当我在该行（this.messageService.add.....）上放置断点时，它执行了添加功能，但由于某种原因烤面包机没有出现，showSuccessToast 工作正常

标签： angular primeng

【解决方案1】：

您的 toast 似乎正在显示，但它只是在您的视图初始化之前显示。我尝试重新创建您的代码，似乎添加 setTimeout 解决了问题

   setTimeout(() => {
      this.messageService.add({
        severity: "success",
        summary: "Success Message",
        detail: "Order submitted"
      });
    }, 1000);

我希望这会有所帮助。

【讨论】：

最好在 AfterViewInit 上挂钩生命周期
AfterViewInit 帮我搞定了

【解决方案2】：

您可能想试试这个，看看它是否有效：

import { NgZone } from '@angular/core';
constructor(private ngZone: NgZone, ...)
this.ngZone.run(() => {
      this.messageService.add({
        severity: "success",
        summary: "Success Message",
        detail: "Order submitted"
      });
});

参考这个帖子： https://forum.primefaces.org/viewtopic.php?f=35&t=56743&p=172855&hilit=Toast#p172855

【讨论】：