只顯示1個toastr

我們在我們的應用程序中使用了angular-toastr.js。我們已經在我們所有的編輯形式使用以下指令：只顯示1個toastr

app.directive('serverError', ['resourceFactory','spinnerService', 'toastr', function (resourceFactory,spinnerService,toastr) { 
 
     return { 
 
      restrict: 'A', 
 
      controller: ['$scope', '$timeout', function ($scope, $timeout) { 
 

 
       var errorToastConfig = {closeButton:true,timeOut:0,tapToDismiss:true}; 
 

 
       $scope.$on('sm:badRequest', function (event, data) { 
 

 
        angular.forEach(data, function (value, key) { 
 
         if (value.message == '') value.message = 'The ' + value.property + ' value is invalid.' 
 
        }); 
 

 
        $scope.errors = data; 
 
        //$scope.alertMessage = resourceFactory.getResource('Messages', 'errorOnForm'); 
 
        //$scope.alertType = 'error'; 
 
        $timeout(function() { 
 
         spinnerService.stopSpinner(); 
 
        }, 0); 
 
        toastr.clear(); 
 
        var errorMsg = ($scope.errors[0] && $scope.errors[0].message?$scope.errors[0].message:resourceFactory.getResource('Messages', 'errorOnForm')); 
 

 
        toastr.error(errorMsg, errorToastConfig); 
 
        $scope.disableAction = false; 
 
       });

的問題是，當頁面遇到錯誤請求我看到3 toastr信息的畫面，而不是僅僅1一上來自我的控制器的代碼和來自這個指令的2，因爲這個代碼被角度執行兩次。添加toastr.clear（）不能解決問題。理想情況下，如果錯誤已由控制器的代碼處理過，我根本不想運行代碼。否則，我想確保我只顯示一個包含錯誤信息的toastr。你看到上面需要改變什麼嗎？

UPDATE。我也可以顯示我們的主要app.js代碼來處理錯誤的請求。當我調試代碼時，我可以看到指令代碼觸發兩次，並且執行調用時，toastrs數組爲空。

這是應用程序的代碼：

app.factory('badRequestInterceptor', ['$rootScope', '$q', function ($rootScope, $q) { 
 
     return { 
 
      'responseError': function (rejection) { 
 
       if (rejection.status === 400) { 
 
        $rootScope.$broadcast("sm:badRequest", rejection.data); 
 
       } 
 
       return $q.reject(rejection); 
 
      } 
 
     }; 
 
    }]); 
 

 
    app.factory('noConnectionInterceptor', ['$rootScope', '$q', function ($rootScope, $q) { 
 
     return { 
 
      
 
      'responseError': function (rejection) { 
 
       console.dir(rejection); 
 
       if (rejection.status === -1) { 
 
        $rootScope.$broadcast("sm:noConnection"); 
 
       } 
 
       return $q.reject(rejection); 
 
      } 
 
     }; 
 
    }]);

來源

2016-06-21 Naomi

您可以防止具有由preventDuplicates屬性設置爲true堆棧相同的祝酒詞。

來自文檔：基於他們的消息內容重複匹配到以前的吐司。

只需將屬性添加到您的errorToastConfig：

var errorToastConfig = {closeButton:true,timeOut:0,tapToDismiss:true, preventDuplicates:true};

更多信息請參見docs。

來源

2016-06-22 02:06:44

不幸的是，雖然它看起來像一個非常有用的屬性，但這並不起作用。我認爲原因在於烤麪包機是在不同的範圍內創建的，這就是爲什麼toastr.clear（）或額外的屬性沒有效果。 app.js具有不良請求的攔截器，就像我剛添加到我的原始郵件一樣。當我調試時，我可以看到指令中的代碼觸發兩次，並且toasters數組爲空。 – Naomi

我不知道這是否可以幫助，但你有沒有嘗試過這些其他屬性'preventOpenDuplicates'或'maxOpened'？ –

我會嘗試，但我想我需要弄清楚爲什麼指令代碼會激發兩次 - 這是主要關心的問題。可能是我有幾種形式的這個指令 - 需要找出答案。 – Naomi

只顯示1個toastr

回答

相關問題