ng-repeat: ключ доступа и значение для каждого объекта в массиве объектов


у меня есть массив объектов, и я использую ng-repeat перебирать их, что легко. Массив выглядит примерно так:

$scope.steps = [
    {companyName: true},
    {businessType: true},
    {physicalAddress: true}
];

и меня выглядит так:

<div ng-repeat="step in steps"> ... </div>

в каждой итерации, step равен одному из объектов, как и ожидалось. Есть ли в любом случае доступ как к ключу, так и к значению

6 57

6 ответов:

ретранслятор внутри ретранслятора

<div ng-repeat="step in steps">
    <div ng-repeat="(key, value) in step">
        {{key}} : {{value}}
    </div>
</div>

на самом деле, ваши данные не очень хорошо дизайн. Вам лучше использовать что-то вроде :

$scope.steps = [
    {stepName: "companyName", isComplete: true},
    {stepName: "businessType", isComplete: true},
    {stepName: "physicalAddress", isComplete: true}
];

тогда легко делать то, что вы хотите:

<div ng-repeat="step in steps">
 Step {{step.stepName}} status : {{step.isComplet}}
</div>

Пример:http://jsfiddle.net/rX7ba/

в случае, если это вариант для вас, если вы поместите свои данные в форму объекта он работает так, как я думаю, вы надеетесь на:

$scope.steps = {
 companyName: true,
 businessType: true,
 physicalAddress: true
};

вот скрипка этого:http://jsfiddle.net/zMjVp/

Я думаю, что проблема заключается в том, как вы разработали свои данные. Для меня с точки зрения семантики, это просто не имеет смысла. Для чего именно нужны шаги?

Он хранит информацию одной компании?

если это так, шаги должны быть объектом (см. ответ KayakDave), и каждый "шаг" должен быть свойством объекта.

Он хранит информацию о нескольких компаниях?

Если это так, шаги должен быть массив объектов.

$scope.steps=[{companyName: true, businessType: true},{companyName: false}]

в любом случае вы можете легко перебирать данные с одним (два для 2-го случая) ng-повторами.

вот еще один способ, без необходимости вложения повторители.

С Angularjs docs:

можно получить ngRepeat для итерации по свойствам объекта, используя следующий синтаксис:

<div ng-repeat="(key, value) in steps"> {{key}} : {{value}} </div>

похоже, что в Angular 1.3.12 вам больше не нужен внутренний ng-repeat, внешний цикл возвращает значения коллекции-это одна запись карты