Angular js：未捕获的错误：[$injector:nomod] 模块不可用答案

【问题标题】：Angular js : Uncaught Error: [$injector:nomod] module unavailableAngular js：未捕获的错误：[$injector:nomod] 模块不可用
【发布时间】：2016-03-11 20:58:12
【问题描述】：

所以我不确定为什么在为我的项目提供服务时会返回此错误

未捕获的错误：[$injector:nomod] 模块 'items.controller' 不是可用的！您要么拼错了模块名称，要么忘记加载它。如果注册模块，请确保将依赖项指定为第二个参数。

我觉得我已经看了太久了，但我仍然不知道缺少什么。我在这里错过了什么？

我的文件结构是这样的...

在我的 items.controller.js 中

(function () {
  'use strict';

  angular
    .module('items.controller')
    .controller('ItemDetailsController', ItemDetailsController);

  function ItemDetailsController($state, $timeout, $stateParams, itemsDataService) {
    var vm = this;
    vm.showItemDetails = showItemDetails;
    vm.item = itemsDataService.getById($stateParams.id);

    $state.$current.data.pageSubTitle = vm.item.title;

    function showItemDetails(id) {
      $state.go('itemDetails', {id: id});
    }
  }
})();

我的 items.module.js 包含...

(function () {
  'use strict';

  angular
    .module('items', [
      'items.controller',
      'items.service'
    ]);

  angular.module('items.controller', []);
  angular.module('items.service', []);

})();

在我的 items.route.js 文件中：

(function () {
  'use strict';

  angular
    .module('items')
    .config(routerConfig);

  function routerConfig($stateProvider) {
    $stateProvider
      .state('itemDetails', {
        url: '/product/:id',
        templateUrl: 'items/itemDetails.html',
        controller: 'ItemDetailsController',
        controllerAs: 'itemDetails'
      })
  }

})();

最后在我的 index.module.js 文件中：

import { config } from './index.config';
import { routerConfig } from './index.route';
import { runBlock } from './index.run';
import { MainController } from './main/main.controller';
import { ItemDetailsController } from '../app/components/items/items.controller';
import { GithubContributorService } from '../app/components/githubContributor/githubContributor.service';
import { WebDevTecService } from '../app/components/webDevTec/webDevTec.service';
import { NavbarDirective } from '../app/components/navbar/navbar.directive';
import { MalarkeyDirective } from '../app/components/malarkey/malarkey.directive';

angular.module('productsFind', ['ngAnimate', 'ngCookies', 'ngTouch', 'ngSanitize', 'ngMessages', 'ngAria', 'ngRoute', 'toastr'])
  .constant('malarkey', malarkey)
  .constant('moment', moment)
  .config(config)
  .config(routerConfig)
  .run(runBlock)
  .service('githubContributor', GithubContributorService)
  .service('webDevTec', WebDevTecService)
  .controller('MainController', MainController)
  .controller('ItemDetailsController', ItemDetailsController)
  .directive('acmeNavbar', NavbarDirective)
  .directive('acmeMalarkey', MalarkeyDirective);

我在哪里加载失败？预先感谢您的帮助。 :)

【问题讨论】：

您确定您的所有JavaScript 文件都已加载到您的HTML 文档中吗？您是否检查过浏览器中的 HTML 源代码？您可能还想在依赖模块之前尝试注册模块。将angular.module('items.controller' 移到angular.module('items') 行上方
我应该假设你的 index.html 中有 ng-app='productsFind' 吗？
@slackmart 是的
@Dieterg 我尝试在上面添加它，似乎抛出了同样的错误：\
请检查我的答案。

标签： javascript angularjs node.js

【解决方案1】：

您需要添加该行 import '../app/components/items/items.module'; 前 import { ItemDetailsController } from '../app/components/items/items.controller'; 在您的 index.module.js 文件中，这是因为您正在使用 ES2015 语法加载模块

稍后你需要按照@slackmart 之前在他的回答中所说的那样做：将模块items 添加到模块productsFind

angular.module('productsFind', ['ngAnimate', 'ngCookies', 'ngTouch', 'ngSanitize', 'ngMessages', 'ngAria', 'ngRoute', 'toastr', 'items'])

【讨论】：