錯誤：[$ injector：unpr]轉換拒絕

我一直在爲一個我正在使用Angular JS的類編寫一個項目。我遇到了錯誤：[$ injector：unpr]（具體錯誤在下面），我查看了堆棧溢出和Angular JS網站，但找不到修復程序。請提前幫助並感謝您。代碼和錯誤如下。

PS：我使用角-UI-路由器版本1.0.3和angularjs版本1.6.5

錯誤

Transition Rejection($id: 0 type: 6, message: The transition errored, 
detail: Error: [$injector:unpr] 
http://errors.angularjs.org/1.6.5/$injector/unpr? 
p0=MenuDataServiceProvider%20%3C-%20MenuDataService) 
_defaultErrorHandler @ angular-ui-router.min.js:13 
(anonymous) @ angular-ui-router.min.js:13 
(anonymous) @ angular.min.js:136 
$digest @ angular.min.js:147 
$apply @ angular.min.js:150 
(anonymous) @ angular.min.js:163 
e @ angular.min.js:48 
(anonymous) @ angular.min.js:51 
setTimeout (async) 
h.defer @ angular.min.js:51 
f @ angular.min.js:163 
(anonymous) @ angular-ui-router.min.js:11 
kg @ angular.min.js:39 
d @ angular.min.js:39 


angular-ui-router.min.js:13 Error: [$injector:unpr] 
http://errors.angularjs.org/1.6.5/$injector/unpr?p0=MenuDataServiceProvider%20%3C-%20MenuDataService 
at angular.min.js:7 
at angular.min.js:46 
at Object.d [as get] (angular.min.js:43) 
at angular.min.js:46 
at Object.d [as get] (angular.min.js:43) 
at t.getNative (angular-ui-router.min.js:12) 
at o (angular-ui-router.min.js:12) 
at Array.map (<anonymous>) 
at t.getDependencies (angular-ui-router.min.js:12) 
at i (angular-ui-router.min.js:12)

控制器

(function() { 
'use strict'; 

angular.module('MenuAppX') 
.controller('categoriesXController', categoriesXController); 


categoriesXController.$inject = ['categoriesResult']; 
function categoriesXController(categoriesResult) { 
    var categoriesX = this; 
categoriesX.cat = categoriesResult; 
}; 
})();

元器件

(function() { 
'use strict'; 

angular.module('MenuAppX') 
.component('categoriesX', { 
    templateUrl: 'src/MenuApp/template/categories.template.html', 
    bindings: { 
    categoriesResult: '<' 
    } 
}); 

})();

服務È

(function() { 
    'use strict' 
    angular.module('data') 
    .service('MenuDataService', MenuDataService); 

    MenuDataService.$inject = ['$http', '$q', '$timeout']; 
    MenuDataService = function($http, $q, $timeout) { 
    var service = this; 

    service.getAllCategory = function() { 
     var deferred = $q.defer(); 
     var categoriesResult = $http({ 
     method: "GET", 
     url: ('https://davids-restaurant.herokuapp.com/categories.json'), 
     }); 
     $timeout(function() { 
    deferred.resolve(categoriesResult); 
    }, 800); 
    return deferred.promise; 
    } 
    // service.getItemsForCategory = function(categoryShortName) { 
// var deferred = $q.defer(); 
// var itemsResult = $http({ 
//  method: "GET", 
//  url: (' https://davids-restaurant.herokuapp.com/menu_items.json?category='), 
//  params: { 
//  category: categoryShortName 
//  } 
// }); 
// console.log(itemsResult); 
// deferred.resolve(itemsResult); 
// } 
    }; 

});

菜單的應用程序模塊

(function() { 
'use strict'; 

angular.module('MenuAppX', ['ui.router', 'data']); 

})();

數據模塊

(function() { 
'use strict'; 

angular.module('data', []) 

})();

路由

(function() { 
'use strict'; 

angular.module('MenuAppX') 
.config(RoutesConfig); 

RoutesConfig.$inject = ['$stateProvider', '$urlRouterProvider']; 
function RoutesConfig($stateProvider, $urlRouterProvider) { 
    $urlRouterProvider.otherwise('/'); 

    $stateProvider 
    .state('home', { 
    url: '/', 
    templateUrl: 'src/MenuApp/template/home.template.html' 
    }) 
    .state('category', { 
    url: '/menuCategory', 
    templateUrl: 'src/MenuApp/template/categories.template.html', 
    controller: 'categoriesXController as categoriesX', 
    resolve: { 
     categories: ['MenuDataService', function (MenuDataService) { 
     return MenuDataService.getAllCategory(); 
     }] 
    } 
    }) 

    .state('items', { 
    url: '/menuItems', 
    templateUrl: 'src/MenuApp/template/items.template.html' 
    }) 
} 
})();

指數

<!DOCTYPE html> 
<html ng-app="MenuAppX"> 
    <head> 
    <meta charset="utf-8"> 
    <title>Menu App</title> 
    </head> 
    <body> 
    <h1>Welcome to the Chinese Menu Website</h1> 

<ui-view></ui-view> 

<!-- Libraries --> 
<script src="lib/angular.min.js"></script> 
<script src="lib/angular-ui-router.min.js"></script> 
<!-- Modules --> 
<script src="src/MenuApp/data.module.js"></script> 
<script src="src/MenuApp/menuapp.module.js"></script> 
<!-- 'menuapp' modules artifacts --> 
<script src="src/MenuApp/menudata.service.js"></script> 
<script src="src/MenuApp/categories.component.js"></script> 
<script src="src/MenuApp/items.component.js"></script> 
<script src="src/MenuApp/categories.controller.js"></script> 
<script src="src/MenuApp/item.controller.js"></script> 
<!-- Routes --> 
<script src="src/routes.js"></script>

來源

2017-09-13 Luca Ciancanelli

我認爲你需要添加包含前menuapp.module.js

<script src="lib/angular.min.js"></script> 
<script src="lib/angular-ui-router.min.js"></script> 
<!-- Modules --> 
<script src="src/MenuApp/data.module.js"></script> 
<script src="src/MenuApp/data.service.js"></script> // MenuDataService serivce script 
<script src="src/MenuApp/menuapp.module.js"></script> 
<!-- 'menuapp' modules artifacts --> 
<script src="src/MenuApp/menudata.service.js"></script> 
<script src="src/MenuApp/categories.component.js"></script> 
<script src="src/MenuApp/items.component.js"></script> 
<script src="src/MenuApp/categories.controller.js"></script> 
<script src="src/MenuApp/item.controller.js"></script> 
<!-- Routes --> 
<script src="src/routes.js"></script>

來源

2017-09-13 03:43:59

我試過了，但還是得到了同樣的錯誤，任何其他的想法了MenuDataService服務的腳本？ –

錯誤：[$ injector：unpr]轉換拒絕

回答

相關問題