缩小 JS 文件后 $http 未注入组件中的控制器

Question

angular.module("datasView",[])
.component("datasView",{
    templateUrl : 'dataview/datasview.template.html',
    controller : function control($http){
        var self = this;
        $http.get('src/data/issues.json').then(function(response){
            // console.log(response.data[0].closed_timestamp);
            self.issueinfo = response.data;
            for(var i = 0; i < response.data.length; i++){
                if(self.issueinfo[i].closed_timestamp == ""){
                    self.issueinfo[i].closed_timestamp = "Open";
                }
            }
        });
    }
});

这是我的代码。当我缩小这个 js 文件时，参数中的 $http 被转换为其他一些随机变量，因此不会从本地 json 文件中获取数据。我该如何纠正这个问题，因为它是一个项目，缩小是必须的。

Answer 1

在控制器定义中添加 [] 以及 '$http'

controller : [ '$http',function control($http){ 

}]

完整示例

angular.module("datasView",[])
.component("datasView",{
    templateUrl : 'dataview/datasview.template.html',
    controller : [ '$http',function control($http){ //opening => [
        var self = this;
        $http.get('src/data/issues.json').then(function(response){
            // console.log(response.data[0].closed_timestamp);
            self.issueinfo = response.data;
            for(var i = 0; i < response.data.length; i++){
                if(self.issueinfo[i].closed_timestamp == ""){
                    self.issueinfo[i].closed_timestamp = "Open";
                }
            }
        });
    }]//closing => ]
});

您可以在这里阅读 Declaring AngularJS Modules For Minification

Answer 2

另一种依赖注入的方式是$injector propert annotation (https://docs.angularjs.org/guide/di#-inject-property-annotation):

(function (angular) {

  'use strict';

  angular.module("datasView",[]).component('datasView', {
    templateUrl : 'dataview/datasview.template.html',
    controller : controllerFunction
  });

  controllerFunction.$inject = ['$http'];
  function controllerFunction ($http) {
    var self = this;
    $http.get('src/data/issues.json').then(function(response){
        // console.log(response.data[0].closed_timestamp);
        self.issueinfo = response.data;
        for(var i = 0; i < response.data.length; i++){
            if(self.issueinfo[i].closed_timestamp == ""){
                self.issueinfo[i].closed_timestamp = "Open";
            }
        }
    });
  }

});

})(angular);

缩小 JS 文件后 $http 未注入组件中的控制器

$http not injected into controller in a component after minification of JS file

minify

angularjs

angularjs-components