Question

有人可以帮助我在角度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错误：无法解决＆＃39; contact / 2.list / 2＆＃39;来自州＆＃39;联系人/：id＆＃39;

日Thnx

编辑：

我做了像@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会在模式中确定重复的名称{{1}}。但是id没问题。例如

请参阅ui-sref文档

州是：

id_list

和HTML：

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

Demo Plunker

带点符号的嵌套视图

1 个答案: