清除单个toastr消息

时间:2015-10-14 05:42:06

标签: angularjs toastr

我想在一次显示的多个toastr消息中清除/隐藏单个toastr消息。是否有任何解决方法,而不是同时清除整个/多个toastr消息。我尝试过以下代码,但对我没用。

toastr.clear([toast]);

价:https://github.com/Foxandxss/angular-toastr

1 个答案:

答案 0 :(得分:3)

您只能清除有效的onInit,而不是已经被解雇的toastr

例如:

toastr

您可以查看 Demo

注意 - toastr demo page中显示的var openedToast = null; $scope.openToast = function(){ openedToast = toastr['success']('message 2', 'Title 2'); toastr['success']('this will be automatically dismissed', 'Another Toast'); } //if you click clearToast quickly, it will be cleared. $scope.clearToast = function(){ if(openedToast ) toastr.clear(openedToast); openedToast = null; //you have to clear your local variable where you stored your toast otherwise this will be a memory leak! } 示例不是最佳做法,因为它会导致内存泄漏。所有toast都存储在toastr.clear()数组中。如果打开10个toast,数组大小将为10.过了一会儿,打开的toasts将会消失,但数组将永远不会被清除。

因此,如果你以这种方式实现你的toastr,你必须小心你的数组。如果要清除阵列中的项目,请确保该项目处于活动状态。

我们如何清除阵列?

要清除数组,我们可以为每个toast注册一个destroy事件:

openedToasts

在HTML中,您可以检查长度:

  $scope.openedToasts = [];       
  $scope.openToast = function() {
    var toast = toastr['success']('message 1', 'Title 1');
    $scope.openedToasts.push(toast);

    registerDestroy(toast); //we can register destroy to clear the array
  }

  function registerDestroy(toast) {
    toast.scope.$on('$destroy', function(item) {
      $scope.openedToasts = $scope.openedToasts.filter(function(item) {
        return item.toastId !== toast.toastId;
      });
    });
  }