ng:areq Argument 'loginController' is not a function, got undefined

1
votes

My code is as shown below:

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; */
}

The moment I run it, it give me error:

Error: [ng:areq] Argument 'loginController' is not a function, got undefined. What am I missing here?

3
angularjs
remove [] from this line angular.module('quflipMobWeb.controllers', []) and try - Rakeschand
It gives me two error [$injector:nomod] Module 'quflipMobWeb.controllers' 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. and Error: [ng:areq] Argument 'loginController' is not a function, got undefined - Mrugesh Thaker
see this docs.angularjs.org/error/$injector/nomod - Rakeschand
if your probem is solved accept the right answer - Rakeschand
Unfortunately, none of this solved my problem - Mrugesh Thaker

3 Answers

0
votes

you need to add the add the ctrl and service script before the app.js 

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

When you define submodule, you need to define it first and then use it

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

and then use it like this

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

When you going to use it like this 

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

There is no module defined with name quflipMobWeb.controllers, it will throw nomod error

check this link out https://docs.angularjs.org/error/$injector/nomod

0
votes

the problem should be on the way you call you controller module on 'loginController':

move the module declaration on top of app.js:

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

and then reference that module on loginController.js like this:

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

Remember this:

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

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