如何在angular js中包含模块以删除找不到的错误模块

how to include module in angualar js to remove error module not found?

本文关键字：模块 删除 错误 找不到 包含 angular js      更新时间：2023-09-26

我正在制作一个简单的应用程序，使用angular js只显示标题http://plnkr.co/edit/dplJ6sf4kgiwJ5pXu4GE?p=preview它只显示"主页"标题我在电脑里做同样的代码，安装因果报应和一切。。

我的问题是我不能测试它的控制器。我得到这个错误

 Failed to instantiate module app.home due to:
        Error: [$injector:nomod] Module 'app.home' 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.4.8/$injector/nomod?p0=app.home
            at /Users/naveenkumar/Documents/ionic_work/SimpleDemo/bower_components/angular/angular.js:68:12

我制作了类似的因果报应.conf.js

// Karma configuration
// Generated on Fri Dec 18 2015 19:53:32 GMT+0530 (IST)
module.exports = function(config) {
  config.set({
    // base path that will be used to resolve all patterns (eg. files, exclude)
    basePath: '',

    // frameworks to use
    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
    frameworks: ['jasmine'],

    // list of files / patterns to load in the browser
    files: [
        'bower_components/angular/angular.js' ,
        'bower_components/jquery/dist/jquery.js' ,
        'bower_components/angular-mocks/angular-mocks.js' ,
        'bower_components/angular-resource/angular-resource.js' ,
        'app/**/.js',
        'app/**/*.html',
      'test/**.js'
    ],

    // list of files to exclude
    exclude: [
    ],

    // preprocess matching files before serving them to the browser
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
    preprocessors: {
        'app/**/*.html':['ng-html2js']
    },
      ngHtml2JsPreprocessor:{
          moduleName:'templates'
    },
    // test results reporter to use
    // possible values: 'dots', 'progress'
    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
    reporters: ['progress'],

    // web server port
    port: 9876,

    // enable / disable colors in the output (reporters and logs)
    colors: true,

    // level of logging
    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
    logLevel: config.LOG_INFO,

    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: true,

    // start these browsers
    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
    browsers: ['Chrome'],

    // Continuous Integration mode
    // if true, Karma captures browsers, runs the tests and exits
    singleRun: false,
    // Concurrency level
    // how many browser should be started simultanous
    concurrency: Infinity
  })
}

我这样做测试

describe('check value',function(){
    var controller,
        $scope,
        $rootScope;
    beforeEach(function(){
        module('app.home')
        inject(function($injector){
            $rootScope=$injector.get('$rootScope');
            $scope=$rootScope.$new();
            controller=$injector.get('$controller')('homecntrl',{$scope:$scope});
        })
    })

    //it('check   value after click',function(){
    //    controller.clickbtn();
    //    expect(controller.message).toEqual('test');
    //})
    it('check  init',function(){
        expect(controller.message).toBeUndefined();
    })
    it('check fine',function(){
        expect(true).toBeTruthy();
    })

})

问题出现在index.html文件中。

第一个问题是，在HTML文件中导入模块之前，先导入了控制器。第二个问题出现在你导入的因果报应版本与你使用的角度版本不匹配的地方。

控制器之前导入的模块

<script src="controller/home.controller.js"></script>
<script src="router/router.js"></script>
<script src="app.js"></script>

Karma设置为Angular版本1.4.8，但Angular是版本1.2.16

<script data-require="angular.js" data-semver="1.2.16" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

导入Angular应用程序的脚本时，必须在模块本身之前导入模块依赖项，最后，所有控制器、指令和服务都必须在它们所属的模块之后导入。"app"依赖于"app.home"，因此"app.home'"在"app"之前导入"homeCntrl"被归因于模块"app"，因此"app"在"homeCtrl"之前导入。

重新排列如下：

<script src="router/router.js"></script>
<script src="app.js"></script>
<script src="controller/home.controller.js"></script>

最后更新你的因果报应版本，以匹配你正在使用的Angular版本。

<script data-require="angular.js" data-semver="1.2.16" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.min.js"></script>

plunkr:

http://plnkr.co/edit/xzvhXHPoUdulOM9clOkQ?p=preview

相关文章：