-1 
public constructor(
    private toasterService: ToasterService) {
}

然后我听烤面包机：

public ngOnInit() {
this.errorWatcher.localConfigObservable.subscribe(exception => {
      const toast: any = {
        type: exception.type,
        body: Helper.toasterBodyMessages(exception.messages)
      };

      this.toasterService.pop(toast);
    });
}

我使用以下方式发送消息：

public invokeMessageOutside(type: string, title: string, message: any) {
    this.exception.type = type;
    this.exception.title = title;

    if (isArray(message)) {
      this.exception.messages = message;
    } else {
      this.exception.messages.push(message);
    }

    this.call();
  }

  private call(): void {
    this.localConfigObservable.next(this.exception);
  }

所以，我不明白为什么有时会显示这个弹出窗口，有时不会。

如果在里面做 console.log() ：

this.errorWatcher.localConfigObservable.subscribe(exception => {
    console.log('Done');
});

它总是有效的。

我的配置是：

 public configToaster: ToasterConfig = new ToasterConfig({
    positionClass: "toast-top-right",
    showCloseButton: true,
    preventDuplicates: true,
    timeout: 5000,
    tapToDismiss: false,
    bodyOutputType: BodyOutputType.TrustedHtml,
    mouseoverTimerStop: false
  });

也许问题出在：preventDuplicates: true？

4

2 回答 2

0

也许问题出在： preventDuplicates: true？

是的。

我创建了一个简单的项目：

export class AppComponent implements OnInit, OnDestroy {
  isAlive = true;
  public config: ToasterConfig = new ToasterConfig({
    positionClass: "toast-top-right",
    showCloseButton: true,
    preventDuplicates: true,
    timeout: 5000,
    tapToDismiss: false,
    bodyOutputType: BodyOutputType.TrustedHtml,
    mouseoverTimerStop: false
  });

  constructor(
      private service: ToasterService,
      private dataService: DataService,
  ) { }

  public sendMessage(): void { 
      this.dataService.setMessage('success', 'Title text', 'Other text');
  }

  ngOnInit(): void { 
    this.dataService.msgEvent.pipe(
        takeWhile(() => this.isAlive)
    ).subscribe(data => {
        this.showToastMessage(data);
    });
  }

  private showToastMessage(data): void { 
    const toast: any = {
        type: data.type,
        body: data.message
      };

      this.service.pop(toast);
  }

  ngOnDestroy(): void { 
      this.isAlive = false;
  }

}

使用服务（在这种情况下无用）：

export class DataService {
    private $msg = new Subject<any>();
    public msgEvent = this.$msg.asObservable();

    public setMessage(type: string, title: string, message: any): void {
        this.$msg.next({
            type: type,
            title: title, 
            message: message
        });
    }
}

第一次点击后，我没有看到任何其他消息。那是因为配置说：preventDuplicates: true

如果您将其更改为false，它将像魅力一样工作。

如果你需要这个项目，你可以从这里分叉它（我不知道为什么，但 stackblitz 现在不适用于任何 angular 项目）：https ://stackblitz.com/edit/angular-aiadys

只要记住做一个npm install。

于 2019-11-21T09:04:49.670 回答
0

这可能是由于 Angular 生命周期摘要。您应该尝试在观察者上添加一些代码。

this.errorWatcher.localConfigObservable.pipe(
  observeOn(asyncScheduler)
).subscribe(exception => {
  const toast: any = {
    type: exception.type,
    body: Helper.toasterBodyMessages(exception.messages)
  };
  this.toasterService.pop(toast);
});
于 2019-11-20T16:29:10.657 回答