AngularJS服务配置价值被摧毁的微小 [英] AngularJS Service Config value get destroyed on minification

问题描述

遇到一些麻烦缩小和AngularJS; - （

Having some trouble with minification and AngularJS ;-(

我找到了HTTP请求此的jsfiddle 加载扩展，通过AngularJS Wiki页面。

I found this jsfiddle "loading" extender for HTTP request, through the AngularJS Wiki page.

这伟大的工作，直到我刊登出来，并缩小毁坏它。
我不能找到一种方法，使用注入的配置，因此IM有点失去了做什么。

It worked great until i published it, and the minification destroys it. I can't find a way to use "inject" on the config, so im kinda lost about what to do.

原来的code：

angular.module("app.services", []).config(function($httpProvider) {
  var spinnerFunction;
  $httpProvider.responseInterceptors.push("myHttpInterceptor");
  spinnerFunction = function(data, headersGetter) {
    $("#loader").show();
    return data;
  };
  return $httpProvider.defaults.transformRequest.push(spinnerFunction);
}).factory("myHttpInterceptor", function($q, $window) {
  return function(promise) {
    return promise.then((function(response) {
      $("#loader").hide();
      return response;
    }), function(response) {
      $("#loader").hide();
      return $q.reject(response);
    });
  };
});

精缩code：

angular.module("app.services", []).config(function (a) {
    var b;
    a.responseInterceptors.push("myHttpInterceptor");
    b = function (d, c) {
        $("#loader").show();
        return d
    };
    return a.defaults.transformRequest.push(b)
}).factory("myHttpInterceptor", function (a, b) {
    return function (c) {
        return c.then((function (d) {
            $("#loader").hide();
            return d
        }), function (d) {
            $("#loader").hide();
            return a.reject(d)
        })
    }
});

这引发以下错误：
错误：未知的提供：a。从app.services

推荐答案

使用内嵌注释定义供应商：

angular.module("app.services", [])
  .config(
    [
      '$httpProvider',
      'myHttpInterceptor',
      function($httpProvider, myHttpInterceptor) {
        var spinnerFunction;
        $httpProvider.responseInterceptors.push(myHttpInterceptor);
        spinnerFunction = function(data, headersGetter) {
         $("#loader").show();
         return data;
        };
        return $httpProvider.defaults.transformRequest.push(spinnerFunction);
      }
    ]
  );

和，顺便说一句，你应该重新考虑使用jQuery您CONFIGS和工厂内的电话。直接DOM操作应该在里面的指令进行处理。

And, btw, you should reconsider using jQuery calls inside your configs and factories. Direct DOM manipulation should be handled inside the directives.

有关你的情况，而不是 $（＃装载机）显示（）; 和 $（＃装载机）节目（）; 你应该广播一个事件（如 $ rootScope $广播（'loader_show'）），然后侦听该事件的自定义的微调指令：

For your case, instead of $("#loader").show(); and $("#loader").show(); you should broadcast an event (e.g. $rootScope.$broadcast('loader_show')), and then listen for that event in your custom 'spinner' directive:

HTML

<div spinner class="loader"></div>

JS：

app.directive('spinner',
    function() {
      return function ($scope, element, attrs) {
        $scope.$on('loader_show', function(){
          element.show();
        });

        $scope.$on('loader_hide', function(){
          element.hide();
        });
      };

    }

  );

这篇关于AngularJS服务配置价值被摧毁的微小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！