如何在httpInterceptor angularjs中注入范围?

时间:2016-04-14 10:02:43

标签: angularjs

工厂

    .factory('authHttpResponseInterceptor',['$q','$location','$rootScope',function($q,$location, $rootScope){
    return {
        responseError: function(rejection) {
            if (rejection.status === 401) {
                console.error("Response 401 in interceptor ");
                $('.modal-logout').modal({
                    backdrop: 'static',
                    keyboard: false
                });
                $('.modal-logout').modal('show');
            }

            if (rejection.status === 403) {
                console.error("Response 403 in interceptor");
                $scope.errorMessages.push("You are not authorized to perform this action.");
            }

            return $q.reject(rejection);
        },

我想在这里注入$ scope来显示403错误消息,但我无法注入。我想将消息推送到我在控制器中定义的errorMessage数组。我怎样才能实现同样的目标。

2 个答案:

答案 0 :(得分:0)

按照设计,你不能在这里注入$ scope。不管你想做什么当然是可能的。

您是否希望能够以两种方式显示错误消息:

1 - 创建一个服务,该服务将在任何控制器之外单独存储和显示消息。

2 - 创建一个服务,用于存储消息并在控制器中使用$ scope。$ watch来观看它们并刷新视图。

拦截方:     if(rejection.status === 403){                 console.error("拦截器中的响应403");                 myService.errorMessages.push("您无权执行此操作。");             }

控制器端:

$scope.$watchCollection(function(){
    return myService.errorMessages;
}, 
function(){
   $scope.myMessages = angular.merge([], myService.errorMessages);
   $timeout(function(){
      $scope.myMessages = [];
   }, 3000);

});

$ tiemout就在这里,你希望在3s之后清除你的消息,你可能不需要它。

$ watchCollection中的第一个函数是观察到的值,第二个函数是更改时的回调。

答案 1 :(得分:0)

另一种方法是使用$ broadcast将事件发送到活动控制器,您可以捕获此http错误并相应地使用。

.factory('authHttpResponseInterceptor',['$q','$location','$rootScope',function($q,$location, $rootScope){
return {
    responseError: function(rejection) {
        if (rejection.status === 401) {
            console.error("Response 401 in interceptor ");
            $('.modal-logout').modal({
                backdrop: 'static',
                keyboard: false
            });
            $('.modal-logout').modal('show');
        }

        if (rejection.status === 403) {
            console.error("Response 403 in interceptor");
            $rootscope.$broadcast("errorEvnt",{message:"Response 403 in interceptor"});
        }

        return $q.reject(rejection);
    },

由于不建议使用rootscope作为您的事件服务,可以通过将其包装在事件服务中并将其注入我们想要监听广播事件的任何地方来完成。 如下所示

check it here