带有点符号的嵌套视图

Question

有人可以帮助我处理 Angular js 中的嵌套视图吗？ 我使用这个点符号

  $stateProvider
  .state('contacts/:id', {
  templateUrl: 'contacts.html',
  controller: function($scope){
  $scope.contacts = [{ name: 'Alice' },       { name: 'Bob' }];
   }
   })
  .state('contacts/:id.list/:id', {
   templateUrl: 'contacts.list.html'
   });

  function MainCtrl($state){
     $state.transitionTo('contacts/:id.list/:id'       );
  }

在html中我也这样称呼状态变化

<a ui-sref="contacts/{{value.id}}.list/{{value.id}}">get<\a>

但我总是得到

angular.js:12477 错误：无法从状态“contact/:id”解析“contact/2.list/2”

谢谢

编辑：

---

我做出改变，就像@Maxim Shoustin 回答的那样。现在状态发生了变化，但是当我单击项目时，在子导航中，父 ui-view 完全刷新（子导航和 ui-view）不仅是子
现在我的状态是这样的

.state('client', {
                url: '/client/info/:itemID',
                templateUrl: 'clientInfo.html',
                controller: 'detailControllerClient as vm',
            })
            .state('client.detail', {
                url: '/detail/:itemID',
                templateUrl: 'itemInfoById.html',
                controller: 'detailControllerClient as vm',
            })

html 就在这里。 （infoDisplay.html 是 index.html 中的父视图。下面代码中的这个 ui-view 是子视图（client.detail）） infoDisplay.html

<div class="new_nav col-lg-1 col-md-1 col-sm-2 col-xs-12">
            <table class="table-hover">
                <thead>
                    <tr>
                        <th>item ID</th>
                    </tr>
                </thead>   
                <tbody>
                    <tr ng-repeat="(key, value) in clientDetail">
                        <td><a ui-sref=".detail({'itemID': value.id})">{{value.id}}</a></td>     
                    </tr>   
                </tbody> 
            </table>
        </div>
        <div ui-view></div> 

Answer 1

<a ui-sref="contacts/{{value.id}}.list/{{value.id}}">get<\a>

您不能将 id.list 与 id 一起使用，因为 Angular 在模式中确定了重复名称 id。但是id_list 没问题。例如

见ui-sref文档

状态在哪里：

.state('contacts', {
    url: '/contacts/:id_list/:id',  
    templateUrl: 'contacts.html'
  })

和 HTML：

<a ui-sref="contacts({'id_list': value.id, 'id': value.id})" >contacts</a>

Demo Plunker