Angular js:Uncaught Error:[$ injector:nomod]模块不可用

Mod*_*esq 4 javascript node.js angularjs

所以我不确定为什么在服务我的项目时会出现这个错误

未捕获错误:[$ 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});
    }
  }
})();
Run Code Online (Sandbox Code Playgroud)

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

(function () {
  'use strict';

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

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

})();
Run Code Online (Sandbox Code Playgroud)

并在我的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'
      })
  }

})();
Run Code Online (Sandbox Code Playgroud)

最后在我的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);
Run Code Online (Sandbox Code Playgroud)

我在哪里加载它?预先感谢您的帮助.:)

小智 5

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

后来你需要这样做,因为@slackmart先前在他的回答中说:将模块添加items到模块中productsFind

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

  • 利昂,你的英语太棒了!:D (3认同)