2013-12-10 4 views
0

요청이 완료 될 때마다 경고 상자를 표시하고 싶습니다. 내 길을 단축하려면 '부트 스트랩 알림'을 사용하는 것이 좋습니다. 공장 내부의 어떤 영역에서도 액세스 할 수있는 방법이없는 것 같습니다. 어떻게 이런 걸 깨달을 수 있니?AngularJS Http 인터셉터, 부트 스트랩 경고 표시

app.factory('httpInterceptor', function ($q) { 
    return { 
     // On request success 
     request: function (config) { 
      $scope.alerts.push({msg: "Request done !"}); //There is no scope 
      return config || $q.when(config); 
     }, 
     // On request failure 
     requestError: function (rejection) { 
      return $q.reject(rejection); 
     }, 
     // On response success 
     response: function (response) { 
      return response || $q.when(response); 
     }, 
     // On response failure 
     responseError: function (rejection) { 
      return $q.reject(rejection); 
     } 
    }; 
}); 

참조 경고 예에 http://angular-ui.github.io/bootstrap/

당신은 인터셉터에 주입하는 서비스 범위를 만들 수 있습니다
+2

$ rootScope를 여기에 주입 할 수 있다고 생각합니다. 시도 해봐. $ rootScope. $ broadcast 메소드를 사용하여 이벤트를 발생시키고 나중에 표시하기 위해 일부 컨트롤러에서이를 catch합니다. – Chandermani

답변

1

:

.factory('alerts', 

function() { 

    var alerts = []; 

    return { 

     getAlerts: function() { 
      return alerts; 
     }, 

     addAlert: function (msg) { 
      alerts.push({ msg: msg }); 
     }, 

     closeAlert: function (index) { 
      alerts.splice(index, 1); 
     } 
    } 
}) 

범위의 컨트롤러처럼 사용에서를 :

function($scope, alerts) { 
    $scope.alerts = alerts.getAlerts(); 
} 

그리고 요격기 자체 :

alerts.addAlert('msg'); 
1

나는이 질문이 꽤 오래된 것으로 알고 있으며 아마도 OP가 더 나은 해결책을 찾았지만 해결 방법을 찾지 못한 사람들에게이 답을 제공하고 있습니다.

우리는 $ 방송 방법을 부트 스트랩과 함께 사용할 수 있습니다. , https://docs.angularjs.org/api/ng/type/ $ rootScope.Scope을 # $ 방송

컨트롤러에서
app.factory('httpInterceptor', function ($q) { 
    return { 
     // On request success 
     request: function (config) { 
      $rootScope.$broadcast("requestDone");    
      return config || $q.when(config); 
     }, 
     // On request failure 
     requestError: function (rejection) { 
      return $q.reject(rejection); 
     }, 
     // On response success 
     response: function (response) { 
      return response || $q.when(response); 
     }, 
     // On response failure 
     responseError: function (rejection) { 
      return $q.reject(rejection); 
     } 
    }; 
}); 

것처럼 이벤트를 수신 : 여기에 방송보다 약 $ 읽기

$rootScope.$on("loginStatus", function(e) { 
    $scope.alerts.push({msg: "Request done !"}); //There is scope 
}); 

건배!

관련 문제