Javascript 如何在相同状态下的参数化URL之间导航？

我有一个父状态myApp和一个子状态planManager。planManager是一个包含三个参数定义URL的视图：planManager/a、planManager/b和planManager/c，其中a、b和c是在中定义的参数：

.config(function config( $stateProvider, $urlRouterProvider ) {
 $stateProvider.state( 'planManager', {
 url: '/planManager/:state',
 views: {
  "main": {
    controller: 'planManagerControl',
    templateUrl: 'planManager/planManager.tpl.html'
  }
 },
data:{ pageTitle: 'Plan Manager' }
});

根据状态参数“state”，我在模板中显示和隐藏3个div

我可以使用

<a href ui-sref="planManagerTest({state: 'a'})">Plan Manager</a>

来自planManagerTest（{state:'a'}）

我试过了， .. 但我不断收到错误“无法导航到州/从planManager”

我怎样才能做到这一点

编辑：我解决了这个问题。只是语法搞错了-我试过了

<a  href ui-sref=".({state: 'b'})">

---

导航开始像一个魔咒一样工作了！

您所遇到的问题很可能是：

• （引述）

将转换到或相对状态路径的状态的名称。如果路径以^or开头，则它是相对的，否则它是绝对的

一些例子：

• $state.go（'contact.detail'）

  将进入'contact.detail'状态

• $state.go（'^'）

  将转到父状态

• $state.go（'^.sibling'）

  将转到同级状态

• $state.go（'.child.green'）

  将转到孙子状态

这与使用方法几乎相同。请参见此处的注释：

有关相对用户界面sref目标的说明：

您还可以在

ui sref

中使用相对状态路径，就像传递到

state.go（）

的相对路径一样。您只需要知道路径是相对于链接所在的状态的，换句话说，就是加载包含链接的模板的状态

为了证明这一切，有一个：

假设我们有这样定义的父状态和子状态：

$stateProvider.state('myApp', {
    url: '/myApp',
    templateUrl: 'myApp.tpl.html',
  });
  $stateProvider.state('myApp.planManager', {
    url: '/planManager/:state',
    views: {
      "main": {
        controller: 'planManagerControl',
        templateUrl: 'planManager.tpl.html',
      }
    },
    ...

然后在根目录（index.html）中，我们可以/必须使用绝对值：

<ul>
  <li><a ui-sref="myApp.planManager({state:'a'})">myApp.planManager({state:'a'})</a></li>
  <li><a ui-sref="myApp.planManager({state:'b'})">myApp.planManager({state:'b'})</a></li>
  <li><a ui-sref="myApp.planManager({state:'c'})">myApp.planManager({state:'c'})</a></li>
</ul>

以及来自

planManager

状态的同级调用

<ul>
  <li><a ui-sref=".({state:'a'})">.({state:'a'})</a></li>
  <li><a ui-sref=".({state:'b'})">.({state:'b'})</a></li>
  <li><a ui-sref=".({state:'c'})">.({state:'c'})</a></li>
</ul>

你完全正确。只是语法有问题。这很有效
<ul>
  <li><a ui-sref=".planManager({state:'a'})">.planManager({state:'a'})</a></li>
  <li><a ui-sref=".planManager({state:'b'})">.planManager({state:'b'})</a></li>
  <li><a ui-sref=".planManager({state:'c'})">.planManager({state:'c'})</a></li>
</ul>

<ul>
  <li><a ui-sref=".({state:'a'})">.({state:'a'})</a></li>
  <li><a ui-sref=".({state:'b'})">.({state:'b'})</a></li>
  <li><a ui-sref=".({state:'c'})">.({state:'c'})</a></li>
</ul>