如何使用Angular Material快餐栏检查解雇原因？

Question

在Angular Material documentation上的小吃栏示例中，操作设置为undo。我还想要一个撤销零食吧。

但有一个问题。单击“关闭”按钮时会触发afterDismissed事件，但是当持续时间过去时也会触发。因此，我的表单清除按钮将清除表单并显示小吃栏，但在5秒后输入返回。

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

Answer 1

当您订阅afterDismissed活动时，您应该能够了解该活动是否来自小吃店行动。

例如，如果您打开小吃店：

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
  }
});

Answer 2

我不确定它何时添加，但MatSnackbarRef现在包含一个单独的onAction可观察对象，仅在实际点击该按钮时调用。