如何修復錯誤：[$ injector：unpr]未知的提供者？

我收到一個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/'); 
    } 
    } 
})();

這是怎麼回事嗎？謝謝！每個文件

來源

2017-02-26 Di Zou

嗯....哇，這裏你的語法是超級混亂。如果你打算使用$ inject，只使用$ inject，不要通過數組注入（示例在這裏：https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md#單獨的數據的呼叫）。要說出這裏發生的事情是非常困難的。好像你正試圖將reportTypeService注入到reportTypeService中，這沒有任何意義。 –

無論您創建的服務，控制器等是否已注入到index.html文件中。當angular找不到您要注入的某個依賴項時，通常會發生此類錯誤。 – pritesh

'.service（'reportTypeService'，['reportTypeService'，reportTypeService]）; reportTypeService。$ inject = ['$ http'];'這看起來不太好。只要堅持其中的一個（並順便說一句，內聯註釋是錯誤的）。 – estus

一個模塊狀圖案，但這裏的問題是，它使用不當這裏。應在其文件中定義子模塊，例如report-type.controller.js：

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

不在父模塊文件report-types.modules.js中。

只有這樣，它可以保證模塊單位那裏，如果模塊存在，並且模塊文件可以以任意順序加載。

來源

2017-02-26 10:43:01 estus

reportTypeService在pitchviz.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"]);

來源

2017-02-26 12:05:31

不是。一旦pitchviz.report-types被加載到主模塊中，reportTypeService屬於哪個模塊並不重要。這在這裏不會導致錯誤。但是，如您所示，定義模塊依賴關係很有用，這是一個很好的做法。 – estus

觀察：這裏，問題是在report-types/controllers/report-type.controller.js因爲你是一個confusable語法那裏。

無需使用注入了$inject服務，你已經注入，使用數組。

刪除此：ReportTypeController.$inject = ['reportTypeService'];

只需使用這樣的：

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

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

來源

2017-02-26 20:09:06

如何修復錯誤：[$ injector：unpr]未知的提供者？

回答

相關問題