Question

在角度中使用ui-router，我已经设置了一个用户＆＃39;我的应用程序中的所有用户都在ng-repeat中返回的状态。我正在尝试为用户个人资料页面创建显示状态，但子状态的视图是继承父视图＆＃39; templates / users / index.html＆＃39; （这是我的app.js：

  .state('users', {
    abstract: true,
    name: 'users',
    url: '/users',
    views: {
      nav: {
        templateUrl: 'templates/navbar.html',
        controller: 'MainCtrl'
      },
      content: {
        templateUrl: 'templates/users/index.html',
        controller: 'UsersCtrl'
      }
    }
  })
    .state('users.show', {
      url: '/show/:id',
      views: {
        nav: {
          templateUrl: 'templates/navbar.html',
          controller: 'MainCtrl'
        },
        content: {
          templateUrl: 'templates/users/show.html',
          controller: 'UsersCtrl'
        }
      }
    });

这是我的index.html：

    <div class="container">
  <label>Search: <input ng-model="searchText"></label>
  <a ui-sref="users.show({id: user.id})" ng-click="showUser(user.id)" ng-repeat="user in users | filter:searchText ">
    <h2> {{ user.name }} </h2>
    <h3> {{ user.email }} </h3>
    <button ng-click="createConversation({sender_id: current_user.id, recipient_id: user.id})" >Message</button>
  </a>
</div>

浏览器中的网址为http://localhost:8080/#/users/show/2但是在users.show状态中继承的html文件是父用户（index.html）文件。

任何帮助表示赞赏！

Answer 1

嵌套视图users.show实际上会在user视图中呈现。因此，您只需将<ui-view>放置在templates/users/index.html视图将呈现的show内。

UI-Router嵌套状态视图未呈现（呈现父视图）

1 个答案: