Question

我正在使用角度ui路由器来创建这样的家庭路线

routes.$inject = ['$stateProvider'];

export default function routes($stateProvider) {
  $stateProvider
    .state('home', {
      url: '/',
      template: require('./home.html'),
      controller: 'HomeController',
      controllerAs: 'home'
    })

在HomeController中，我正在导入一个提供博客帖子流的服务。因此，在./home.html模板中，我正在迭代这样的帖子数组，为每个帖子创建链接

 <span ng-repeat="post in home.posts">

         <a ui-sref="home.detail({postId:post.id})">{{post.title.rendered}}</a>

    </span>

正如您从链接中看到的那样，我希望点击链接由home.detail州处理。在路由器中，我这样做，期望每个帖子都有一个网址（当我点击链接时）http://localhost:8888/1或http://localhost:8888/4。但是，当我单击链接时，URL会更改，但./post.html模板不会加载，并且下面的控制器代码中的日志语句不会运行。控制台中没有错误。

问题：当我点击帖子的链接（但网址更改）时，为什么路由器代码处理单个链接的点击（加载新模板，记录stateParams）没有运行？

  $stateProvider
    .state('home', {
      url: '/',
      template: require('./home.html'),
      controller: 'HomeController',
      controllerAs: 'home'
    })
   .state('home.detail', {


        url: '{postId:[0-9]{1,4}}',
        template: require('./post.html'),
        controller: ['$scope', '$stateParams',
            function (  $scope,   $stateParams) {
                console.log($scope, "$scope", $stateParams, "$stateParams");
                $scope.post = $stateParams;

            }],

Answer 1

您的父州需要一个ui-view。来自ui-router的documentation

子状态会将其模板加载到父级的ui视图中。

url更改不会使用角度ui路由器触发状态更改

1 个答案: