Question

我正在使用Pluralsight在Play by Play: Angular Testing进行角度测试，而我添加的第一个模块是在门外抛出NG异常。

angular.js:68 Uncaught Error: [$injector:nomod] Module 'app.people' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

http://errors.angularjs.org/1.5.8/ $注射器/ NOMOD？P0 = app.people

我以前经历了很多次，但由于某种原因，我今天找不到我的错误。

详情：

Angular版本为v1.5.8。

我的应用文件夹结构在此图片中显示，您会注意到我根据课程添加的新people文件夹：

新的app.people模块是：

(function(){
  'use strict';

  angular.module('app.people',[
    'app.core',
    'app.widgets',
    'app.layout'
  ]);
});

我已将app.people模块添加到app.module：

(function() {
'use strict';

angular.module('app', [
 'app.core',
 'app.widgets',
 'app.admin',
 'app.people',         // ** NEW PEOPLE MODULE **
 'app.dashboard',
 'app.layout'
]);

})();

从Win 7 cmd提示符运行gulp dev-serve之后。我的index.html文件更新如下（注意people.module.js部分下面注入的文件：

<!DOCTYPE html>
<html ng-app="app">

<head>
  <style>    
    .ng-hide {
      display: none!important;
    }
  </style>
  <title ng-bind="title">
    angular-test
  </title>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1" />
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no" />
  <base href="/">

  <!-- build:css styles/lib.css -->
  <!-- bower:css -->
  <link rel="stylesheet" href="/bower_components/bootstrap/dist/css/bootstrap.css" />
  <link rel="stylesheet" href="/bower_components/toastr/toastr.css" />
  <!-- endbower -->
  <!-- endbuild -->

  <!-- build:css styles/app.css -->
  <!-- inject:css -->
  <link rel="stylesheet" href="/.tmp/styles.css">
  <!-- endinject -->
  <!-- endbuild -->
</head>

<body>
  <div>
    <div ng-include="'app/layout/shell.html'"></div>
    <div id="splash-page" ng-show="showSplash">
      <div class="page-splash">
        <div class="page-splash-message">
          angular-test
        </div>
        <div class="progress progress-striped active page-progress-bar">
          <div class="bar"></div>
        </div>
      </div>
    </div>
  </div>

  <!-- build:js js/lib.js -->
  <!-- bower:js -->
  <script src="/bower_components/jquery/dist/jquery.js"></script>
  <script src="/bower_components/angular/angular.js"></script>
  <script src="/bower_components/angular-sanitize/angular-sanitize.js"></script>
  <script src="/bower_components/bootstrap/dist/js/bootstrap.js"></script>
  <script src="/bower_components/extras.angular.plus/ngplus-overlay.js"></script>
  <script src="/bower_components/moment/moment.js"></script>
  <script src="/bower_components/angular-ui-router/release/angular-ui-router.js"></script>
  <script src="/bower_components/toastr/toastr.js"></script>
  <script src="/bower_components/angular-animate/angular-animate.js"></script>
  <script src="/bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
  <!-- endbower -->
  <!-- endbuild -->

  <!-- build:js js/app.js -->
  <!-- inject:js -->
  <script src="/src/client/app/app.module.js"></script>
  <script src="/src/client/app/admin/admin.module.js"></script>
  <script src="/src/client/app/blocks/exception/exception.module.js"></script>
  <script src="/src/client/app/blocks/logger/logger.module.js"></script>
  <script src="/src/client/app/blocks/router/router.module.js"></script>
  <script src="/src/client/app/core/core.module.js"></script>
  <script src="/src/client/app/dashboard/dashboard.module.js"></script>
  <script src="/src/client/app/layout/layout.module.js"></script>
  
  <!-- ****** NEW PEOPLE MODULE INJECTED HERE ***** -->
  <script src="/src/client/app/people/people.module.js"></script>
  
  <script src="/src/client/app/widgets/widgets.module.js"></script>
  <script src="/src/client/app/admin/admin.controller.js"></script>
  <script src="/src/client/app/admin/admin.route.js"></script>
  <script src="/src/client/app/blocks/exception/exception-handler.provider.js"></script>
  <script src="/src/client/app/blocks/exception/exception.js"></script>
  <script src="/src/client/app/blocks/logger/logger.js"></script>
  <script src="/src/client/app/blocks/router/router-helper.provider.js"></script>
  <script src="/src/client/app/core/config.js"></script>
  <script src="/src/client/app/core/constants.js"></script>
  <script src="/src/client/app/core/core.route.js"></script>
  <script src="/src/client/app/core/dataservice.js"></script>
  <script src="/src/client/app/dashboard/dashboard.controller.js"></script>
  <script src="/src/client/app/dashboard/dashboard.route.js"></script>
  <script src="/src/client/app/layout/ht-sidebar.directive.js"></script>
  <script src="/src/client/app/layout/ht-top-nav.directive.js"></script>
  <script src="/src/client/app/layout/shell.controller.js"></script>
  <script src="/src/client/app/layout/sidebar.controller.js"></script>
  <script src="/src/client/app/people/people.controller.js"></script>
  <script src="/src/client/app/people/people.route.js"></script>
  <script src="/src/client/app/widgets/ht-img-person.directive.js"></script>
  <script src="/src/client/app/widgets/ht-widget-header.directive.js"></script>
  <!-- endinject -->

  <!-- inject:templates:js -->
  <!-- endinject -->
  <!-- endbuild -->
</body>

</html>

如果您可以帮我确定我的app.people模块导致NG异常的原因，我将不胜感激。

感谢，鲍勃

Answer 1

我花了这么多时间才最终运行测试任务grunt test以获得关于我的问题是什么的线索。结果IIFE错过了最终的()结束父母，如下所示：

＆＃13;

(function(){
  'use strict';

  angular.module('app.people',[
    'app.core',
    'app.widgets',
    'app.layout'
  ]);
})();

＆＃13;

应用程序现在成功运行，现在注册新的People菜单项和路由：

遵循John Papa的Angular Testing课程

1 个答案: