Question

尝试实现属于抽象父状态的抽象子状态并且具有子状态本身时遇到了问题。如下所示：

.state('parent', {
  abstract: true,
  url: '/parent',
  templateUrl: 'parent/parent.html',
  controller: 'parent-controller',    
})

.state(parent.child', {
  abstract: true
  url: '/child',
  templateUrl: 'parent/child/child.html',
  controller: 'child-controller',
})

.state(parent.child.grandchild', {
  url: '/grandchild',
  templateUrl: 'parent/child/grandchild/grandchild.html',
  controller: 'grandchild-controller',
})

到目前为止，我还没有能够解决这个问题，也没有找到任何解决这个问题的答案。该文件似乎只涵盖了亲子，但没有进入孙子孙女。

这是否可以使用UI-Router处于角度？在声明州名时，我的失败与使用点符号有关吗？

Answer 1

这个概念应该有效。有a working plunker

只需修改一些拼写错误

  .state('parent', {
    abstract: true,
    url: '/parent',
    templateUrl: 'parent/parent.html',
    controller: 'parent-controller',
  })

  .state('parent.child', {
    abstract: true,
    url: '/child',
    templateUrl: 'parent/child/child.html',
    controller: 'child-controller',
  })

  .state('parent.child.grandchild', {
      url: '/grandchild',
      templateUrl: 'parent/child/grandchild/grandchild.html',
      controller: 'grandchild-controller',
    })

确保我们有控制器

.controller('parent-controller', ['$scope', function($scope) {}])
.controller('child-controller', ['$scope', function($scope) {}])
.controller('grandchild-controller', ['$scope', function($scope) {}])

并且每个父母都有一个孩子的目标

...
<div ui-view></div>
...

这些链接必须正常工作

<a href="#/parent/child/grandchild">    
<a ui-sref="parent.child.grandchild">

在action here

中查看

抽象的儿童状态和孙状态在角度与UI路由器

1 个答案: