angularjs - ui-router sref 到孙子,参数在子项中

标签 angularjs angular-ui-router

当子状态的 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!'});

最佳答案

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>

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

  $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

关于angularjs - ui-router sref 到孙子,参数在子项中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24333625/

相关文章:

javascript - Angular js - 无法将 json 获取到 $rootScope 中

javascript - 为什么我的 ng-class 即使在 false 时也会显示

angularjs - 来自 Controller 的引用 Angular ng-form

angularjs - 如何使用 angular-ui-router 滚动到页面的某个区域?

javascript - 在 AngularJs 中设置动态填充下拉菜单的默认值

javascript - FileReader onload 仅在浏览器中第二次工作

javascript - 当链接仅为 "#"时,防止路由参数更改 View

angular-ui-router - 数据表内的Angular Material 2 routerlink

javascript - Angular 2 : uiRouter get current state params in root component

angularjs - Angular Hash 与 Hashbang