未调用ui-router嵌套路由控制器

Question

我试图调用一个控制器,它应该与home.category 路由链接,但它没有被调用.这有什么不对？

$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

好吧,我发现从给定的文件线索的ui-router的说

您可以将控制器分配给模板.警告:如果未定义模板,则不会实例化控制器.

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

但我试图添加template,但仍然没有工作,然后我看到我的父路由模板没有<div ui-view></div>(我错误地删除它)所以当我添加它回来工作:),所以,实例化我们孩子的路由控制器,我们必须<div ui-view></div>在父母的路线模板中.

Answer 2

控制器可能无法被调用的另一个原因是,如果您有一个状态的多个视图,并且不将控制器放在视图对象中.这很难找到,因为没有错误.它只是没有被调用.

不会调用此控制器:

.state('home', {
    url: '/',
    controller: function($scope){ $scope.someThings = "some stuff"; },
    views: {
        "view1": {                
            template: '<p>{{someThings}}</p>'
        },
        "": {
            template:
                '<p>Some other stuff</p>'
        }
    }
})

控制器必须进入视图对象:

.state('home', {
    url: '/',        
    views: {
        "view1": {                
            template: '<p>{{someThings}}</p>',
            controller: function($scope){ $scope.someThings = "some stuff"; },
        },
        "": {
            template:
                '<p>Some other stuff</p>'
        }
    }
})