CODEWITHSUNDEEP
angularjsangular-ui-routerangularjs-routing
Sa Xi
Sa Xi

Reputation: 43

Can not use contrller in $stateProvider.state

app.js :

var testRoute= angular.module('testRoute', ['ui.router']);

testRoute.config(function ($stateProvider, $urlRouterProvider) {

    $urlRouterProvider.otherwise('/home');

    $stateProvider

        .state('home', {
            url: '/home',
            templateUrl: 'home/partial-home.html',
            controller: 'myController'
        })

        .state('about', {
            url: '/about',
            templateUrl: 'about/partial-about.html'
        });

});

I've defined a controller ready and I want to use that controller in each state, but it does not work and I got an error message. How can I use the controller?

Upvotes: 1

Views: 40

Answers (2)

Asik
Asik

Reputation: 7977

Please check this demo

var testRoute= angular.module('testRoute', ['ui.router']);

testRoute.config(function ($stateProvider, $urlRouterProvider) {

    $urlRouterProvider.otherwise('/home');

    $stateProvider.state('home', {
            url: '/home',
            templateUrl: 'home.html',
            controller: 'myController'
        })

    $stateProvider.state('about', {
            url: '/about',
            templateUrl: 'about/partial-about.html'
        });

});

var myController = function($scope){
 alert("hello world!");
}

testRoute.controller('myController', myController);

Upvotes: 0

triggerNZ
triggerNZ

Reputation: 4751

You need to register myController as a controller, not just have it as a function. So if you have: 

function myController($scope) {
  ...
}

You will need to say:

testRoute.controller('myController', myController);

Or you can also simply do it inline, 

testRoute.controller('myController', function($scope) {
   ...
});

Upvotes: 1

Related Questions