Как использовать вложенные ng-repeat в Angular Js?

Question

Я пытаюсь повторить 4 элемента в формате 2x2 с верхними и нижними отдельными строками. Для этого я использую ng-repeat, чтобы повторить верхнюю и нижнюю строки, а затем повторить еще один ng-repeat, чтобы повторить два элемента. Я сделал это и получил требуемый формат. Но моя проблема в том, что мне нужно предоставить разные заголовки для этих 4 элементов (div). Как я могу дать заголовки в массиве, чтобы он повторялся в обеих строках? Ниже мой код:

<div class="massage-type-section" ng-controller="massageController"> 
    <div class="select-massage-type" ng-repeat="item in massage"> 
     <div class="massage-choice" ng-repeat="type in massageType"> 
      <div class="massage-choice-icon"> 
       <img src="images/single-icon-deselect.png"> 
       <img src="images/single-icon.png"> 
      </div> 
      <p class="massage-title">{{type.title}}</p> 
      <p class="section-details">One massage practitioner comes to massage one person.</p> 
      <div class="type-selected"><img src="images/selected.png"></div> 
     </div> 
    </div> 
</div> 

function massageController($scope) { 
    $scope.massage = [{}, {}]; 
    $scope.massageType = [ 
     { title: 'Single' }, 
     { title: 'Couple' } 
    ]; 
}; 

Answer 1

Если основное требование во внутреннем массиве только для отображения названия массажного Type, ваш массив выглядит хорошо. Пожалуйста, отметьте как ответ, если это поможет.

Answer 2

Если ваше требование состоит в том, чтобы давать разные заголовки на разных уровнях, соответствующим образом используйте индекс $ index или $ parent. $ Index.

Чтобы найти индекс элемента в использовании коллекции $ индекса недвижимости Чтобы получить индекс родительского элемента Использование $ родителя. $ Индекс или Используйте нг-INIT = «parentIndex = $ индекс»