ng:areq Argument' loginController'不是一个函数,未定义

时间:2017-09-07 07:25:24

标签: angularjs

我的代码如下所示:

的index.html

<!DOCTYPE html>
<html>

<head>
    <title>quflip</title>
    <link rel="stylesheet" href="css/app.css">
    <link rel="stylesheet" href="css/login.css">
</head>

<body ng-app="quflipMobWeb">
    <ng-view></ng-view>
    <script src="bower_components/angular/angular.js"></script>
    <script src="bower_components/angular-route/angular-route.js"></script>
    <script src="js/app.js"></script>
    <script src="js/services.js"></script>
    <script src="js/controller/loginController.js"></script>
    <script src="js/controller/driverController.js"></script>
    <script src="js/controller/driversController.js"></script>
</body>

</html>

app.js

angular.module('quflipMobWeb', [
    'quflipMobWeb.services',
    'quflipMobWeb.controllers',
    'ngRoute'
]).
config(['$routeProvider', function($routeProvider) {
    $routeProvider.
    when("/drivers", { templateUrl: "template/drivers.html", controller: "driversController" }).
    when("/drivers/:id", { templateUrl: "template/driver.html", controller: "driverController" }).
    when("/login", { templateUrl: "template/login.html", controller: "loginController" }).
    otherwise({ redirectTo: '/login' });
}]);

loginController.js

angular.module('quflipMobWeb.controllers', [])
    .controller('loginController', function($scope) {
        console.log("tested");
    });

的login.html

<div class="q-login-background">
    <h3>It is website,enjoy it</h3>
</div>

app.css

/* app css stylesheet */

body {
    width: 100vw;
    height: 100vh;
}

login.css

.q-login-background {
    width: 100vw;
    height: 100vh;
    /* background: url ("../img/ic_login.jpg") no-repeat; */
}

我跑的那一刻,它给了我错误:

Error: [ng:areq] Argument 'loginController' is not a function, got undefined。我在这里缺少什么?

3 个答案:

答案 0 :(得分:0)

您需要在app.js

之前添加添加ctrl和服务脚本
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="js/services.js"></script>
<script src="js/controller/loginController.js"></script>
<script src="js/app.js"></script>
<script src="js/controller/driverController.js"></script>
<script src="js/controller/driversController.js"></script>

答案 1 :(得分:0)

定义子模块时,需要先定义子模块,然后再使用它

angular.module('quflipMobWeb.controllers', [])

然后像这样使用它

angular.module('quflipMobWeb.controllers')
    .controller('loginController', function($scope) {
        console.log("tested");
    });

当你打算像这样使用它时

angular.module('quflipMobWeb.controllers', [])
    .controller...

没有使用名称quflipMobWeb.controllers定义的模块,它会抛出nomod错误

检查此链接 https://docs.angularjs.org/error/ $注射器/ NOMOD

答案 2 :(得分:0)

问题应该出在你打电话给控制器模块的路上&#39; loginController&#39;:

将模块声明移到 app.js

之上
angular.module('quflipMobWeb.controllers', [])

然后在 loginController.js 上引用该模块,如下所示:

angular.module('quflipMobWeb.controllers') //no empty array argument since your not declaring the module here!
    .controller('loginController', function($scope) {
        console.log("tested");
    });

记住这一点:

angular.module("noop", []) //declare, usually on app.js

angular.module("noop") //retrieve anywhere you need it