带有子参数的ui-router sref到孙子答案

【问题标题】：ui-router sref to grandchild with parameter in child带有子参数的ui-router sref到孙子
【发布时间】：2014-06-20 18:35:58
【问题描述】：

当我在子状态的 URL 中有一个参数时，如何创建一个将我带到孙状态的 sref？

这是一些伪代码：

.state( 'foo', {url:'/', template:'<div ui-view></div><a ui-sref="foo.bar.baz(bar: 'bing')">Bing Baz</a>'})
.state( 'foo.bar', {url:':bar',abstract: true, templateURL:'bar.tpl.html'})
.state( 'foo.bar.baz', {url:'/baz', template:'I am a baz, and if you clicked from the foo state, I should be a Bing Baz!'});

【问题讨论】：

标签： angularjs angular-ui-router

【解决方案1】：

有an example。我们可以这样称呼它（我已经删除了摘要以显示更多变体，但中间状态可能是抽象的！只是不能通过 url 直接访问）：

<a ui-sref="foo">foo</a>
<a ui-sref="foo.bar({bar:'bing'})">foo.bar({bar:'bing'})</a>
<a ui-sref="foo.bar.baz({bar:'bing'})">foo.bar.baz({bar:'bing'})</a>

还有一些重新定义的状态，它们使用相对的 stat 语法提供对子状态的调用：

  $stateProvider
    .state('foo', {
      url: '/',
      template: '<div><h3>I. The foo state</h3>' + 
      'Child : <a ui-sref=".bar({bar: \'bing\'})">.bar.baz({bar: \'bing\'})</a>' +
      '<div ui-view></div>' +
      ' </div>', 
    })
    .state('foo.bar', {
      url: ':bar',
      //abstract: true,
      template: '<div><h4>II. The foo.bar state</h4>' + 
      'Child : <a ui-sref=".baz({bar: \'bing\'})">.baz({bar: \'bing\'})</a>' +
      '<div ui-view></div>' +
      ' </div>',
    })
    .state('foo.bar.baz', {
      url: '/baz',
      template: '<div><h5>III. The foo.bar.baz state</h5>' + 
      '<div ui-view></div>' +
      ' </div>',
    });

在plunker中查看更多信息

【讨论】：

在我的非伪代码中，我没有正确转义我表示为 bar:'bing' 的变量。查看您的代码，它与我的伪代码大致相同，但我意识到我的错误。