Angularjs:错误:[ng:areq] 参数“HomeController”不是函数,未定义

IT技术 javascript angularjs angularjs-service
2021-03-02 05:40:04

这是我使用 angularjs 创建服务文件并将服务添加到控制器的演示。

我的演示有两个问题:

  • 一个是当我<script src="HomeController.js"><script src="MyService.js">收到此错误之前放置时

错误:[ng:areq] 参数“HomeController”不是函数,未定义

  • 另一个是当我<script src="MyService.js"><script src="HomeController.js">收到以下错误之前放置时

错误:[$injector:unpr] 未知提供者:MyServiceProvider <- MyService

我的来源:

文件Index.html

<!DOCTYPE html>
<html >
    <head lang="en">…</head>
    <body ng-app="myApp">
        …
        <div ng-controller="HomeController">
            <div ng-repeat="item in hello">{{item.id + item.name}}</div>
        </div>

        <script src="Scripts/angular.js"></script>
        <script src="Scripts/angular-route.js"></script>

        <!-- App libs -->
        <script src="app/app.js"></script>    
        <script src="app/services/MyService.js"></script>
        <script src="app/controllers/HomeController.js"></script>
    </body>
</html>

文件HomeController.js

(function(angular){
    'use strict';

    var myApp = angular.module('myApp',[]);

    myApp.controller('HomeController',function($scope,MyService){    
        $scope.hello=[];
        $scope.hello = MyService.getHello();
    });
})(window.angular);

文件MyService.js

(function(angular){
    'use strict';

    var myApp = angular.module('myApp',[]);

    myApp.service('MyService', function () {
        var hello =[  {id:1,name:'cuong'},
            {id:2,name:'nguyen'}];
        this.getHello = function(){
            return hello;
        };
    });

})(window.angular);
6个回答

这将创建一个新module/应用程序:

var myApp = angular.module('myApp',[]);

虽然这访问了一个已经创建的module(注意省略了第二个参数):

var myApp = angular.module('myApp');

由于您在两个脚本上都使用了第一种方法,因此您基本上是在覆盖您之前创建的module。

在加载的第二个脚本上,使用var myApp = angular.module('myApp');.

这也修复了我的错误。我错误地将 angular.module('myApp', ['ui.router']) 留在了 2 个不同的文件(app.js 和 routes.js)中。一旦我从 routes.js 中删除了数组,它就修复了单元测试。
2021-04-24 05:40:04

我曾经遇到过这个错误。我的问题是我没有添加FILE_NAME_WHERE_IS_MY_FUNCTION.js

所以我的file.html从未找到我的函数在哪里

添加“file.js”后,我解决了问题

<html ng-app='myApp'>
    <body ng-controller='TextController'>
    ....
    ....
    ....
    <script src="../file.js"></script>
    </body>
</html>
帮了大忙。Yeoman 将脚本标签放在角度生成器的 index.html 底部......很容易错过。谢谢你!
2021-04-20 05:40:04
运行相同的问题。必须在我的索引页面中添加相应的 controller.js 文件以及其他控制器
2021-05-05 05:40:04

还要确保您的控制器在 index.html 底部的 script 标签中定义,就在 body 的结束标签之前。

 <!-- build:js({.tmp,app}) scripts/scripts.js -->
    <script src="scripts/app.js"></script>
    <script src="scripts/controllers/main.js"></script>
    <script src="scripts/controllers/Administration.js"></script>
    <script src="scripts/controllers/Leaderboard.js"></script>
    <script src="scripts/controllers/Login.js"></script>
    <script src="scripts/controllers/registration.js"></script>

如果您的 specific.html、specific.js 和 app.js 页面上的所有内容都拼写为“正确”(相同),这应该可以解决您的问题。

每当我错过注射列表和功能之间的“,”时,我就遇到过几次

app.controller('commonCtrl', ['$scope', '$filter',function($scope,$filter) {

}]);
在控制器名称和注射列表之间缺少“,”时,我也遇到了同样的事情,即 app.controller('commonCtrl' ['$scope', '$filter',function($scope,$filter) { }]);
2021-04-29 05:40:04

我也遇到了这个错误,但就我而言,这是因为控制器命名约定。我声明controller: "QuestionController".state但是在控制器定义中我声明了它

yiiExamApp.controller('questionController' ...

但应该是

yiiExamApp.controller('QuestionController' ...

希望能帮助那些因为这个愚蠢的错误而面临这个错误的人,我浪费了 4 个小时来识别它。