Question

这是我使用angularjs的演示，用于创建服务文件，以及向控制器添加服务。

我的演示有两个问题：

其中一个是我在<script src="HomeController.js">之前<script src="MyService.js">发出此错误，

错误：[ng：areq]参数'HomeController'不是函数，未定义

另一种是当我在<script src="MyService.js">之前放<script src="HomeController.js">时出现以下错误，

错误：[$ injector：unpr]未知提供者：MyServiceProvider＆lt; - 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);

Answer 1

这会创建一个新模块/ app：

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

虽然这会访问已创建的模块（注意省略第二个参数）：

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

由于您在两个脚本上使用第一种方法，因此基本上覆盖了先前创建的模块。

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

Answer 2

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

所以我的 file.html 从未找到我的功能

一旦我添加＆＃34; file.js＆＃34;我解决了这个问题

<html ng-app='myApp'>
    <body ng-controller='TextController'>
    ....
    ....
    ....
    <script src="../file.js"></script>
    </body>
</html>

Answer 3

同时确保您的控制器在index.html底部的脚本标记内定义，就在正文的结束标记之前。

 <!-- 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>

提供所有内容拼写正确＆＃34; （相同）在您的specific.html，specific.js和app.js页面上，这应解决您的问题。

Answer 4

每当我错过“注射和功能列表”之间的“，”时，发生了几次

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

}]);

Answer 5

我也遇到过这个错误，但在我的情况下，这是因为控制器命名约定。我在controller: "QuestionController"中声明.state，但在控制器定义中，我声明它像

yiiExamApp.controller('questionController' ...

但它应该是

yiiExamApp.controller('QuestionController' ...

希望这有助于面对这个错误的人因为这个愚蠢的错误而浪费了4小时来识别它。

Answer 6

我得到了同样的错误。我像这样定义了java脚本

<script src="controllers/home.js" />

然后我改成了这个

<script src="controllers/home.js"></script>

此后我的问题解决了。

Answer 7

如果所有ELSE都失败并且你在MEAN堆栈上本地运行就像我一样吞咽......只需停下来再次服务！我正在拉听我的声音，仔细检查所有帖子中的所有内容，但无法使用，直到我只是重新运行gulp服务。

Answer 8

我也遇到了同样的错误，对我来说修复是将我的子模块包含在主模块数组中。

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

Answer 9

我的项目中也遇到过这个问题。在我使用my-controller.js标记将karma.conf.js插入我的<script>文件后，它最终有效。

希望这会有所帮助。导致这个问题的原因很多。

Answer 10

我有类似的问题。该修复程序确保您的ctroller不仅定义在index.html底部的脚本标记内，就在正文的结束标记之前，还要验证它们是否符合文件夹的结构。

<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>

Answer 11

显然以前的帖子很有用，但上面的任何内容对我的情况都没有帮助。原因是加载脚本的错误序列。例如，在我的情况下，控制器editCtrl.js依赖于（使用）ui-bootstrap-tpls.js，因此应该首先加载它。这导致了一个错误：

O(N log N)

这是对的，有效：

<script src="scripts/app/station/editCtrl.js"></script>
<script src="scripts/angular-ui/ui-bootstrap-tpls.js"></script>

因此，要修复所需的错误首先声明所有没有依赖项的脚本，然后再依赖于先前声明的脚本。

Answer 12

试试这个

    <title>My First Angular App</title>

</head>

<body>

     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

    <h3>Adding Simple Controller<h3>        

    <div ng-controller="SimpleController">
        Name:

        <br/>

        <input type = "text" data-ng-model = "name"/> {{name}}

        <br/>

        <ul>    
            <li data-ng-repeat = "cust in customers | filter:name | orderBy:'city'">
                {{cust.name}} - {{cust.city}}
            </li>
        </ul>

    </div>


    <script>

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

        angularApp.controller('SimpleController', [ '$scope', SimpleController]);

        function SimpleController($scope)
        {

            $scope.customers = [
                                    {name:'Nikhil Mahirrao', city:'Pune'},
                                    {name:'Kapil Mahire', city:'Pune'},
                                    {name:'Narendra Mahirrao', city:'Phophare'},
                                    {name:'Mithun More', city:'Shahada'}

                                ]; 
        }

    </script>

</body>

Answer 13

就我而言，我在html文件中缺少Angular应用程序的名称。例如，我已将此文件包含在我的应用程序代码的开头。我以为它正在运行，但它不是。

<强> app.module.js

game()

然而，当我在html中宣布应用程序时，我有这个：

<强>的index.html

(function () {
    'use strict';

    angular
        .module('app', [
        // Other dependencies here...
        ])
    ;

})();

但是，为了通过我使用的名称引用Angular应用程序，我不得不使用：

index.html（已修复）

<html lang="en" ng-app>

Answer 14

我也遇到了这个错误。

我必须将新控制器添加到路由信息中。 \ SRC \ JS \ app.js

angular.module('Lillan', [
  'ngRoute',
  'mobile-angular-ui',
  'Lillan.controllers.Main'
])

我添加了控制器，使其看起来像

angular.module('Lillan', [
  'ngRoute',
  'mobile-angular-ui',
  'Lillan.controllers.Main',
  'Lillan.controllers.Growth'
])

干杯！

Answer 15

我收到错误是因为我在脚本之前添加了控制器脚本，我在应用程序中定义了相应的模块。首先添加脚本

<script src = "(path of module.js file)"></script>

然后只添加

<script src = "(path of controller.js file)"></script>

在主文件中。

Answer 16

错误：ng：areq Bad Argument 让我好几次，因为我太快关闭了方括号。在下面的BAD示例中，它在'$ state'之后被错误地关闭，当它实际上应该在最后的括号之前。

BAD：

sampleApp.controller('sampleApp', ['$scope', '$state'], function($scope, $state){

});

GOOD：

sampleApp.controller('sampleApp', ['$scope', '$state', function($scope, $state){

}]);

Answer 17

对我来说，解决方案是在 HomeController.js 中声明的函数之一后添加一个分号

//Corrected code is :
app.controller('HomeController', function($scope, $http, $log) {

  $scope.demo1 = function(){
      console.log("In demo");
  } //Here i forgot to add the semicolon
  
  $scope.demo2 = function(){
      console.log("In demo");
  };
  
});

Answer 18

我不小心将 HomeController.js 直接移到了预期的位置。再次将其放回原始位置。

此后，我的网站开始每秒自动加载页面，我什至无法看到该错误。所以我清除了浏览器缓存。解决了问题

Answer 19

我的控制器文件被缓存为空。清除缓存已为我修复。

Answer 20

sampleApp.controller('sampleApp', ['$scope', '$state', function($scope, $state){

对我来说同样的事情，逗号'，'在函数帮我修复问题之前 - 错误：ng：areq Bad Argument

Answer 21

检查您的HTML页面是否包含：

angular.min脚本
app.js
控制器JavaScript页面

包含文件的顺序很重要。这是我解决这个问题的方法。

希望这有帮助。

Answer 22

同时检查拼写错误。

var MyApp = angular.module('AppName',[]);
MyApp.controller('WRONG_SPELLING_MyCtrl', ['$scope', MyControllerCtrl])
function MyControllerCtrl($scope) {
   var vm = $scope;
   vm.Apple = 'Android';
}

<div ng-controller="ACTUAL_SPELLING_MyCtrl">
    {{Apple}}
</div>

Answer 23

在我的情况下，当我没有在数组参数中声明函数时，会出现此错误。

错误：

的那个

taskAppControllers.controller('MainMenuCtrl', []);

固定的：

taskAppControllers.controller('MainMenuCtrl', [function(){

}]);

Answer 24

我遇到了同样的问题，但我忘了将文件包含在grunt / gulp最小化过程中。

grunt.initConfig({
  uglify: {
    my_target: {
      files: {
        'dest/output.min.js': ['src/input1.js', 'src/missing_controller.js']
      }
    }
  }
});

希望有所帮助。

Answer 25

是。正如许多人先前指出的那样，我已将src路径添加到index.html中的所有控制器文件。

<script src="controllers/home.js"></script>
<script src="controllers/detail.js"></script>
<script src="controllers/login.js"></script>
<script src="controllers/navbar.js"></script>
<script src="controllers/signup.js"></script>

这解决了这个错误。

Angularjs：错误：[ng：areq]参数'HomeController'不是函数，未定义

25 个答案: