ui-router sref 到孙子中的参数 [英] ui-router sref to grandchild with parameter in child

问题描述

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

How can I create a sref that will take me to a grandchild state, when I have a parameter in the URL for the child state?

这是一些伪代码:

.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!'});

推荐答案

有一个例子.我们可以这样称呼它(我已经删除了摘要以显示更多变体，但中间状态可能是抽象的！只是不能通过 url 直接访问):

There is an example. We can call it like this (I've removed the abstract to show more variants, but the middle state could be abstract! just not directly accessible via 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>

还有重新定义的状态，它们使用相对统计语法提供对子状态的调用:

And there are redefined states, which are providing calls to children state with a relative stat syntax:

  $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

这篇关于ui-router sref 到孙子中的参数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！