ui-router nested route controller isn't being called

Question

I am trying to call a controller which should be linked with the home.category route but it isn't being called. What's wrong in it?

$stateProvider       .state("home", {     // Use a url of "/" to set a states as the "index".     url: "/",     templateUrl: APP_CONFIG.baseUrl +       'partials/layouts/home.html',     controller: 'MainCtrl'   })   .state("home.category", {     // Use a url of "/" to set a states as the "index".     url: "c/:categoryId/:categorySlug",     controller: function($stateParams) {       alert($stateParams.categoryId);     }   }) 

Answer 1

Well, I found a clue from the given documentation of ui-router the says

You can assign a controller to your template. Warning: The controller will not be instantiated if template is not defined.

https://github.com/angular-ui/ui-router/wiki#controllers

But I tried to add template and still didn't work, then I saw that my parent route template didn't have <div ui-view></div> (I mistakenly removed it) so when I added it back it worked :), So, to instantiate our child's route controller, we must have <div ui-view></div> in our parent's route template.