Devider 목록을 DOM에 바인딩 AngularJS

Question

배열에있는 사람들의 목록을 번호순으로 그룹화하고 숫자로 묶은 다음 ng-repeat을 사용하여 DOM에 바인딩하려고합니다. .

{ 
    'street1':{ 
     '1':[ 'name1', 'name2', 'name3' ] , 
     '2':[ 'name1', 'name2', 'name3' ] 
    }, 
    'street2':{ 
     '1':[ 'name1', 'name2', 'name3' ] , 
     '2':[ 'name1', 'name2', 'name3' ] 
    } 
} 

자바 스크립트 : 내가 원하는 결과가 이것이다

var tmp = {}; 
    for (i = 0; i < Names.length; i++) { 
     var street = Names[i].Street; 
     var num = Names[i].Number; 
     var name = Names[i].Name; 
     if (tmp[street] == undefined) { 
      tmp[street] = {}; 

     } 
     var str = tmp[street]; 
     if (str[num] == undefined) { 
      str[num] = []; 
     } 
     str[num].push(name); 
    } 
    var $scope.filteredTerrInfo = tmp; 

HTML :

 <ion-list data-ng-repeat="(street, numbers) in filteredTerrInfo"> 

     <div class="item item-divider"> 
      <h2> {{street}}</h2> 
     </div> 

     <div class="item item-divider" data-ng-repeat="(number, names) in numbers"> 
      <h2>{{number}}</h2> 
     </div> 

     <div class="item item-left-thumbnail" data-ng-repeat="x in names"> 
      <h2>{{x}}</h2> 
     </div> 
    </ion-list> 

위의 코드는 거리와 수 deviders를 표시하지만, 표시 할 수 없습니다 이름 목록. 어떤 생각?

Answer 1

data-ng-repeat="x in names"이 루프 외부 data-ng-repeat="(number, names) in numbers" 외부에 있기 때문에 names 값에 액세스 할 수 없기 때문입니다. 템플릿을 다음으로 변경해보십시오 :

<div class="item item-divider" data-ng-repeat="(number, names) in numbers"> 
    <h2>{{number}}</h2> 
    <div class="item item-left-thumbnail" data-ng-repeat="x in names"> 
     <h2>{{x}}</h2> 
    </div> 
</div>