오류 : [$ injector : unpr] 알 수없는 공급자는 어떻게 수정합니까?

Question

angular.js:14362 Error: [$injector:unpr] Unknown provider: reportTypeServiceProvider <- reportTypeService <- ReportTypeController 오류가 발생합니다.

나는 이것에 관해 많은 자료를 찾았지만 여전히 문제가 내 코드에 무엇인지 파악할 수 없습니다. 여기있다 :

pitchviz.js :

(function() { 
    'use strict'; 

    angular 
    .module('pitchviz', [ 
     'pitchviz.config', 
     'pitchviz.routes', 
     'pitchviz.report-types' 
    ]); 

    angular 
    .module('pitchviz.config', []); 

    angular 
    .module('pitchviz.routes', ['ngRoute']); 

    angular 
    .module('pitchviz') 
    .run(run); 

    run.$inject = ['$http']; 

    function run($http) { 
    $http.defaults.xsrfHeaderName = 'X-CSRFToken'; 
    $http.defaults.xsrfCookieName = 'csrftoken'; 
    } 
})(); 

pitchviz.config.js :

(function() { 
'use strict'; 

    angular 
    .module('pitchviz.config') 
    .config(config); 

    config.$inject = ['$locationProvider']; 

    function config($locationProvider) { 
    $locationProvider.html5Mode(true); 
    $locationProvider.hashPrefix('!'); 
    } 
})(); 

pitchviz.routes.js :

(function() { 
    'use strict'; 

    angular 
    .module('pitchviz.routes') 
    .config(config); 

    config.$inject = ['$routeProvider']; 

    function config($routeProvider) { 
    $routeProvider.when('/', { 
     controller: 'ReportTypeController', 
     controllerAs: 'vm', 
     templateUrl: '/static/templates/report-types/report-types.html' 
    }).otherwise('/'); 
    } 
})(); 

보고서 - 유형/보고서 -types.modules.js :

(function() { 
    'use strict'; 

    angular 
    .module('pitchviz.report-types', [ 
     'pitchviz.report-types.controllers', 
     'pitchviz.report-types.services' 
    ]); 

    angular 
    .module('pitchviz.report-types.controllers', []); 

    angular 
    .module('pitchviz.report-types.services', []); 
})(); 

보고서 - 유형/컨트롤러/보고서 - type.controller.js :

(function() { 
    'use strict'; 

    angular 
    .module('pitchviz.report-types.controllers') 
    .controller('ReportTypeController', ['reportTypeService', ReportTypeController]); 

    ReportTypeController.$inject = ['reportTypeService']; 

    function ReportTypeController(reportTypeService) { 
    var vm = this; 

    vm.reportType = undefined; 

    activate(); 

    function activate() { 

     reportTypeService.get().then(reportTypeSuccess, reportTypeError); 

     function accountSuccess(data, status, headers, config) { 
     console.log(data); 
     vm.reportType = data.data; 
     } 

     function reportTypeError(data, status, headers, config) { 
     console.log(data); 
     console.log(status); 
     } 
    } 
    } 
})(); 

보고서 형/서비스/보고서 - type.service.js는 :

(function() { 
    'use strict'; 

    angular 
    .module('pitchviz.report-types.services') 
    .service('reportTypeService', ['reportTypeService', reportTypeService]); 

    reportTypeService.$inject = ['$http']; 

    function reportTypeService($http) { 
    var reportTypeService = { 
     get: get 
    }; 

    return reportTypeService; 

    function get() { 
     console.log("service"); 
     return $http.get('/api/report-types/'); 
    } 
    } 
})(); 

여기 무슨 일이야? 감사!

Answer 1

파일 당 하나의 모듈이 단색 패턴이지만 여기에서 잘못 사용되는 것이 문제입니다. 하위 모듈은 파일에 정의되어야합니다. report-type.controller.js :

angular 
    .module('pitchviz.report-types.controllers', []) 
    .controller('ReportTypeController', ...) 

상위 모듈 파일에는 report-types.modules.js가 없습니다.

모듈 만 있으면 모듈 단위가 있고 모듈 파일은 임의의 순서로로드 될 수 있습니다.

Answer 2

reportTypeServicepitchviz.report-types.services 모듈. 그러나 ReportTypeController은 pitchviz.report-types.controllers 모듈입니다. 나는 pitchviz.report-types.controllers이 별도의 모듈이기 때문에 reportTypeService을 식별 할 수 없다고 생각한다. pitchviz.report-types.controllers 모듈에 reportTypeService에 액세스하려는 경우 reportTypeService을 pitchviz.report-types.controllers 모듈에 추가하거나 pitchviz.report-types.services 모듈을 pitchviz.report-types.controllers 모듈에 삽입해야합니다.

angular.module("pitchviz.report-types.controllers", ["pitchviz.report-types.services"]); 

Answer 3

관측 : 당신이 거기 confusable 구문을 만들고 여기에, 문제가 report-types/controllers/report-type.controller.js입니다.

• 배열을 사용하여 이미 삽입 했으므로 $inject을 사용하여 서비스를 삽입 할 필요가 없습니다.

이 제거 ReportTypeController.$inject = ['reportTypeService'];

단순히이 사용

.controller('ReportTypeController', ['reportTypeService', ReportTypeController]); 

function ReportTypeController(reportTypeService) { 
    .... 
    .... 
    .... 
}