CODEWITHSUNDEEP
angularjsangular-ui-routerangularjs-routingangularjs-controller
uksz
uksz

Reputation: 18699

Issue with angular-ui-router and $stateProvider

So I have used ui-router in my web page. So far I have two views: list of users, and profile of the user.

I created following states:

.config(function($stateProvider, $urlRouterProvider) {
//
// For any unmatched url, redirect to /state1
$urlRouterProvider.otherwise("/home"); 
//
// Now set up the states
$stateProvider
    .state('home', {
        url: "/home",
        templateUrl: "index.html",
        controller: "View1Ctrl"
    })
    .state('profile', {
        url: "/profile/:user",
        templateUrl: "profile/profile.html",
        controller: "ProfileCtrl",
        params : { user: null }
    })
});

My module includes:

angular.module('myApp', [
'ngRoute',
'ui.bootstrap',
'ui.router',
'myApp.home',
'myApp.profile',
])

And the Controller which throws an error:

ngular.module('myApp.profile' ,['ngRoute', 'ui.bootstrap'])


.controller('ProfileCtrl', function($stateProvider) {
        console.log($stateProvider.params);
    });

And this is the error:

Error: [$injector:unpr] http://errors.angularjs.org/1.3.14/$injector/unpr?p0=<div ui-view="" class="ng-scope">tateProviderProvider%20%3C-%20%24stateProvider%20%3C-%20ProfileCtrl

So: do you have any ideas where did I go wrong?

Upvotes: 1

Views: 331

Answers (2)

Pankaj Parkar
Pankaj Parkar

Reputation: 136134

If you want to use $stateParams in myApp.profile module you should include ui.router in it, instead of ngRoute module.

angular.module('myApp.profile' ,['ui.router', 'ui.bootstrap'])

Upvotes: 1

svikasg
svikasg

Reputation: 93

Are you trying to access the params? You should be doing

$stateParams.user for /profile/:user and pass in $stateParams instead of $stateProvider in your controller.

.controller('ProfileCtrl', function($stateParams) {
    console.log($stateParams);
});

Upvotes: 2

Related Questions