angular - 如何使用 Angular Material snackbar 检查解雇原因？

Question

在 Angular Material documentation 上的 snackbar 示例中该操作设置为 undo。我还想要一个撤消 snackbar 。

但是有一个问题。 afterDismissed 事件在单击关闭按钮时触发，但在持续时间结束时也会触发。所以我的表单清除按钮将清除表单并显示 snackbar ，但 5 秒后输入又回来了。

有没有办法检查撤消按钮是否调用了解除？我不想使用自定义 Snackbar，因为我必须重新制作 Snackbar 设计...

Answer 1

当您订阅 afterDismissed 事件时，您应该能够了解该事件是否来自 snackbar 操作。

例如，如果您打开 snackbar :

const snackBarRef = this.snackBar.open('Dummy message', 'Undo', {duration: 5000});

然后订阅事件:

snackBarRef.afterDismissed().subscribe(info => {
  if (info.dismissedByAction === true) {
    // your code for handling this goes here
  }
});