Angular JS ng-repeat 중첩 배열

Question

ng-repeat를 사용하여 배열을 반복하려고하지만 올바른 출력을 얻지 못했습니다.

<table> 
    <tr> 
    <th>Index</th> 
    <th>Items</th> 
    </tr> 
    <tr ng-repeat="li in list"> 
    <td ng-repeat="(key,value) in li">{{key}}</td> 
    <td ng-repeat="(key,value) in li">{{value}}</td> 
    </tr> 
</table> 


$scope.list = [ 
     {"foo": ["item1", "item2"]}, 
     {"bar": ["item1", "item2"]} 
    ]; 

예상 출력 :

Index Items 
foo item1 
foo item2 
bar item1 
bar item2 

실제 출력 :

Index Items 
foo ["item1","item2"] 
bar ["item1","item2"] 

누구나 정확한 키를 인쇄 나 좀 도와 목록의 값입니다.

Answer 1

결과를 단순화 할 사용자 지정 필터 또는 함수를 만들 수 있습니다. 그 또한 중첩 된 ng-repeat의의

$scope.simplyfiedList = []; 

$scope.list.forEach(function(item){ 
    Object.keys(item).map(function(key){ 
    item[key].map(function(i){ 
     $scope.simplyfiedList.push({key: key, value: i}); 
    }) 
    }) 
}); 

HTML을

<table class="table table-responsive"> 
    <tr> 
    <th>Index</th> 
    <th>Items</th> 
    </tr> 
    <tr ng-repeat="item in simplyfiedList"> 
    <td>{{item.key}}</td> 
    <td>{{item.value}}</td> 
    </tr> 
</table> 

당신은 아마 이런 식으로 뭔가를해야 할 것입니다 데이터의 구조를 감안할 때

Demo Plunker

Answer 2

을 제거합니다.

나는 그것을 테스트하지 않았고 또한 추천하지 않을 것이다. 데이터를 평평하게하는 함수를 작성하고 싶습니다.