HttpRequestInterceptor display multiples раз такую ​​же ошибку

Question

Я добавил HttpRequestInterceptor insie мое приложение AngularJS, чтобы отображать toastr каждый раз, когда запрос терпит неудачу.

angular.module('spwApp.factories') 
    .factory('httpRequestInterceptor', ['$q', '$injector', '$cookies', '$rootScope', function($q, $injector, $cookies, $rootScope) { 
     return { 
      'request': function($config) { 
       var token = $cookies.get('token'); 
       $config.headers['Authorization'] = 'Bearer ' + token; 
       return $config; 
      }, 
      'responseError': function(rejection) { 
       var toastr = $injector.get('toastr'); 
       var $state = $injector.get('$state'); 
       toastr.options = { 
        "closeButton" : true, 
        "preventDuplicates" : true, 
        "timeOut": "50000", 
        "extendedTimeOut" : "50000" 
       }; 
       toastr.remove(); 
       switch (rejection.status) { 
        case 401: 
         if ($state.current.name != 'login') { 
          $state.go('login'); 
          toastr.info('Re-enter username/password', 'Invalid sessions', toastr.options); 
         } 
         break; 
        case 403: 
         toastr.error('You do not have the rights', 'Forbidden', toastr.options) 
         $state.go('home'); 
         break; 
        case 404: 
         toastr.error('Cannot found', '??', toastr.options); 
         $state.go('home'); 
         break; 
        case 500: 
         toastr.error('Unexpected error', 'Hum...', toastr.options); 
         $state.go('home'); 
         break; 
        case -1: 
         toastr.error('Connection to server not possible', 'Ouch...', toastr.options); 
         $state.go('home'); 
         break; 
        default: 
         toastr.error('That is not supposed to land here', 'Oops...', toastr.options); 
         $state.go('home'); 
         break; 
       } 
       return $q.reject(rejection); 
      } 
     }; 
    }]); 

На определенной странице, я должен решить несколько данных с моего сервера

.state('stateA', { 
    url: '/urlToStateA', 
    views: { 
     'content@stateA': { 
      templateUrl: 'app/stateA.html', 
      controller: 'controllerA', 
      controllerAs: 'vm', 
      resolve: { 
       dataA: ['myService', function(myService) { 
        return myService.getDataA(); 
       }], 
       dataB: ['myService', function(myService) { 
        return myService.getDataB(); 
       }], 
       dataC: ['myService', function(myService) { 
        return myService.getDataC(); 
       }] 
      } 
     } 
    } 
}) 

Таким образом, когда мой сервер выключен, каждый запрос получит rejection.status == -1, а затем отобразить toastr Connection to server not possible

Проблема в том, что строка toastr.remove(); не работает. Предполагается удалить весь тост, но ничего не делает.

Как удалить toastr перед добавлением нового? Могу ли я заменить неработающий toastr.remove() на некоторый чистый javascript, чтобы вручную выбрать и удалить toastr?

Answer 1

Вы должны сделать configuration changes, чтобы предотвратить одновременное открытие toastr's.

toastr configurations можно изменить в config функция углового.

myApp.config(Config); 

    function Config($httpProvider,toastrConfig) { 

    $httpProvider.interceptors.push('interceptorService'); 

    angular.extend(toastrConfig, { 
     autoDismiss: false, 
     containerId: 'toast-container', 
     maxOpened: 0,  
     newestOnTop: true, 
     positionClass: 'toast-top-center', 
     preventDuplicates: false, 
     preventOpenDuplicates: true, 
     target: 'body' 
    }); 

    } 

preventOpenDuplicates: true эта линия будет препятствовать тому же сообщение от показа несколько раз.

От Customizing the toastr link reference

• autoDismiss: Если установлено, показывают только самые последние maxOpened тост (ы)
• containerId: имя контейнера, в котором вы хотите добавить свои тостов (контейнер будет создан для вас).
• maxOpened: Максимальное количество тостов, отображаемых одновременно.
• newestOnTop: Добавить новые тосты на вершине старого. Наденьте ложь, чтобы положить их на дно.
• positionClass: Позиция, в которой добавлены тосты.
• preventDuplicates: Предотвратить дубликаты последнего тоста.
• preventOpenDuplicates: Предотвратить дубликаты открытых тостов.
• цель: Элемент, чтобы положить контейнер toastr.