Блог

Главная - Вопросы по программированию - Как мне использовать вложенный ng-repeat в Angular Js?

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

#javascript #html #angularjs #arrays #angularjs-ng-repeat

#javascript #HTML #angularjs #массивы #angularjs-ng-repeat

Вопрос:

Я пытаюсь повторить 4 элемента в формате матрицы 2×2 с отдельными строками сверху и снизу. Для этого я использую 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' }
    ];
};

Комментарии:

1. Не могли бы вы привести наглядный пример, чтобы сделать ваше требование более понятным. Я не смог определить ваше требование на основе того, что вы написали.

Ответ №1:

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

Ответ №2:

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

Чтобы найти индекс элемента в коллекции, используйте свойство $index Для получения индекса родительского элемента Используйте $parent.$index или используйте ng-init=»parentIndex = $index»