Angular2-toaster 认为两个吐司是重复的？答案

【问题标题】：Angular2-toaster thinks two toasts are duplicate?Angular2-toaster 认为两个吐司是重复的？
【发布时间】：2020-05-21 23:48:30
【问题描述】：

我正在使用 angular2-toaster，并试图了解为什么 2 个带有不同消息的 toast 被认为是“重复的”toast，因此只出现了 1 个 toast。我想要两个祝酒词都出现。

我有这个代码：

var toast: Toast = {
  type: 'error',
  title: "one toast, from one dev to another",
};
var toast2: Toast = {
  type: 'error',
  title: "another toast, yo!",
};

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

在一个单独的文件中，我有这个烤面包机配置：

this.config = new ToasterConfig({
  positionClass: "toast-top-center",
  timeout: 10000,
  newestOnTop: true,
  tapToDismiss: true,
  preventDuplicates: true,
  animation: "fade",
  limit: 3,
});

除了类型之外，这些 toasts 是“重复的”吗？

【问题讨论】：

标签： angular typescript angular2-toaster

【解决方案1】：

我同意digitalkoi的回答。

补充一点，如果你想使用没有body的toast，你也可以将preventDuplicates设置为false。

this.config = new ToasterConfig({
  positionClass: "toast-top-center",
  timeout: 10000,
  newestOnTop: true,
  tapToDismiss: true,
  ★preventDuplicates: false,
  animation: "fade",
  limit: 3,
});

【讨论】：

【解决方案2】：

这个组件检查 toastId 和 body 是否有重复。

源代码：

if (this.toasterconfig.preventDuplicates && this.toasts.length > 0) {
  if (toast.toastId && this.toasts.some(t => t.toastId === toast.toastId)) {
    return;
  } else if (this.toasts.some(t => t.body === toast.body)) {
    return;
  }
}

由于您的 toast 没有正文，因此它们匹配并且未通过重复检查。

var toast: Toast = {
  type: 'error',
  title: 'one toast, from one dev to another',
  body: 'test'
};
var toast2: Toast = {
  type: 'error',
  title: 'another toast, yo!',
  body: 'test2'
};
this.toasterService.pop(toast);
this.toasterService.pop(toast2);

这应该可行。

【讨论】：