Getting a Module Error in AngularJS when adding a controller to UI Router state

Question

App.js

var myApp=angular.module('sampleApp', ['ui.router','MainCtrl', 'NerdCtrl', 
'NerdService', 'GeekCtrl', 'GeekService','ngMaterial']);
myApp.config(function($stateProvider, $urlRouterProvider){
$stateProvider
    .state('login', {
        url: '/login',
        templateUrl: 'views/login.html'

    })
    .state('nerd', {
        url: '/nerd',
        templateUrl: 'views/nerd.html',
        //controller: NerdController
    })
    .state('geek', {
        url: '/geek',
        templateUrl: 'views/geek.html'
    });

$urlRouterProvider.otherwise('/login');
});

I started with an AngularJs boilerplate and tried to use UI Router with it and, I've been stuck on this for a while. When I comment out the line of code shown above, it works fine and no errors come up. However when I add the controller, I get this module error in the console with "ReferenceError: NerdController is not defined" . I've defined the controller and added the controller dependency and I'm not sure what I need to do. It seems like a simple error that I'm overseeing. Thanks for the help!

Here is the controller file:

angular.module('NerdCtrl', []).controller('NerdController', function($scope) 

{
$scope.tagline = 'Nothing beats a pocket protector!';
});

Could it be something wrong with my directory structure?

post your index.html where you have refered .js files

Sajeetharan
– Sajeetharan

2018-01-20 11:28:49 +00:00
Commented Jan 20, 2018 at 11:28 — Sajeetharan
– Sajeetharan, Commented Jan 20, 2018 at 11:28

Ved · Accepted Answer · 2018-01-20 11:36:07Z

4

Change to : controller: "NerdController"

var myApp=angular.module('sampleApp', ['ui.router','MainCtrl', 'NerdCtrl', 
    'NerdService', 'GeekCtrl', 'GeekService','ngMaterial']);
    myApp.config(function($stateProvider, $urlRouterProvider){
    $stateProvider
        .state('login', {
            url: '/login',
            templateUrl: 'views/login.html'

        })
        .state('nerd', {
            url: '/nerd',
            templateUrl: 'views/nerd.html',
            controller: "NerdController"
        })
        .state('geek', {
            url: '/geek',
            templateUrl: 'views/geek.html'
        });

    $urlRouterProvider.otherwise('/login');
    });

answered Jan 20, 2018 at 11:36

Ved

12.1k5 gold badges46 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Getting a Module Error in AngularJS when adding a controller to UI Router state

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related