错误:$ injector:unpr未知提供者:itemslistProvider< -

时间:2017-01-21 08:52:59

标签: javascript html angularjs web-services

我已经调试了大约几天的代码但无法找到解决方案。我已经阅读了angularjs文档以及针对错误的几个现有SO问题,但仍然无法发现由于代码失败而导致的任何错误。

这是我的任务之一,我几乎完成并为其编写代码,但我只是坚持在一个类别中显示项目。显示类别的代码工作正常,但显示项目的代码非常相似。我真的很困惑,并走到了尽头。我请你只给我一个提示或一行我可能会出错。我不是要求整个解决方案,因为它违反了荣誉准则。

所以,这是文件

的index.html

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <link rel="stylesheet" href="css/styles.css">
 <title>My Restro</title>
</head>
<body ng-app="MenuApp">
<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/menuapp.module.js"></script>
 <script src="src/menuapp/data.module.js"></script>
 <!-- Routes -->
 <script src="src/routes.js"></script>

 <!-- 'MenuApp' module artifacts -->
 <script src="src/menuapp/menudata.service.js"></script>
 <script src="src/menuapp/categories.component.js"></script>
 <script src="src/menuapp/categories.controller.js"></script>
 <script src="src/menuapp/items.component.js"></script>
 <script src="src/menuapp/item-detail.controller.js"></script>
 <!-- <script src="src/menuapp/main-menuapp.controller.js"></script> -->
</body>
</html>

项-detail.controller:

(function () {
  'use strict';

  angular.module('MenuApp')
  .controller('ItemDetailController', ItemDetailController);

  // 'itemlist' is injected through state's resolve
  ItemDetailController.$inject = ['MenuDataService','itemslist'];
  function ItemDetailController(MenuDataService,itemslist) {
    var itemDetailCtrl = this;
    itemDetailCtrl.itemslist=itemslist;
   }

   })();

routes.js

(function () {
 'use strict';

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

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

  .........//other states code.....
  //items state code
  .state('items', {
    url: '/items/{categoryShortName}',
    templateUrl: 'src/menuapp/templates/item-detail.template.html',
    controller: 'ItemDetailController as itemDetailCtrl',
    resolve: {
        itemlist: ['$stateParams', 'MenuDataService',
        function ($stateParams, MenuDataService) {
          return MenuDataService.getItemsForCategories($stateParams.categoryShortName);
        }]
    }
  });
 }

 })();

1 个答案:

答案 0 :(得分:0)

在您的路线中,您有解决名称项目列表,并将其作为itemslist注入。我应该是这样的。

ItemDetailController.$inject = ['MenuDataService','itemlist'];
function ItemDetailController(MenuDataService,itemlist) {
  var itemDetailCtrl = this;
  itemDetailCtrl.itemlist=itemlist;
}

})();