Question

我希望也许一双新鲜的眼睛可以看到我在这里失踪的（可能是显而易见的）作品。我有一个相当简单的plunker来说明问题。

我有一些状态和一个嵌套子项低于抽象状态的状态。 SREF看起来不适合那个孩子（Child2）：

angular.module('MyApp', ['ui.router'])

.config(function($stateProvider, $urlRouterProvider) {

  $urlRouterProvider.otherwise('/');

  $stateProvider

    .state('index', {
      url: '/',
      views: {
        'header@': {template: '<h2>Header</h2>'},
        'content@': {template: '<h1>Content<h1>'},
        'footer@': {template: '<h4>Footer<h4>'}
      },
    })

    .state('index.child1', {
      url: 'child1',
      views: {
        'content@': {template: '<h1>Child1 Content<h1>'}
      }
    })

    .state('index.secure', {
      abstract: true,
      data: {
        auth: true
      }
    })

    .state('index.secure,child2', {
      url: 'secure/child2',
      views: {
        'content@': {template: '<h1>Secure Child2 Content</h1>'}
      }
    });

});

Index.html（为简洁起见删除了脚本标记，但它们位于plunker＆gt;

<html ng-app="MyApp">
 <head>
   <link href="style.css" rel="stylesheet">
 </head>
 <body>

   <a ui-sref="index">Index</a>
   <a ui-sref="index.child1">Child1</a>
   <!-- the one below does not work -->
   <a ui-sref="index.secure.child2">SecureChild2</a>

   <div ui-view="header"></div>
   <div ui-view="content"></div>
   <div ui-view="footer"></div>

  </body>
</html>

为什么Child2 sref无效？我怀疑，由于长时间盯着这段代码的细节，我上瘾的东西显而易见。

TIA！

Answer 1

您在index.secure.child2

的州声明中使用的是逗号而不是点

.state('index.secure,child2', {
  url: 'secure/child2',
  views: {
    'content@': {template: '<h1>Secure Child2 Content</h1>'}
  }
});

应该是：

   .state('index.secure.child2', { // uses a dot. 
  url: 'secure/child2',
  views: {
    'content@': {template: '<h1>Secure Child2 Content</h1>'}
  }
});

继承人的固定版本： http://plnkr.co/edit/amhvuUGXxURQ3aQxBWtF

Angular嵌套ui-router状态的SREF不起作用

1 个答案: