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

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

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

И мой атрибут ng-repeat выглядит так:

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

В каждой итерации step равно одному из объектов, как и ожидалось. Есть ли какой-либо доступ к ключу и значению объекта step? Чтобы я мог сделать что-то вроде этого:

<div ng-repeat="(stepName, isComplete) in steps"> ... </div>

Где stepName == 'companyName' и isComplete == true. Я пробовал делать это точно, но stepName всегда заканчивается тем, что является индексом объекта шага (что имеет смысл). Я просто пытаюсь выяснить, есть ли другой способ написать синтаксис ng-repeat, чтобы я мог получить ключ и значение.

Спасибо за любые идеи/предложения. Очень ценится.

PS. Моя текущая работа заключается в том, чтобы просто сделать это в моем контроллере:

$scope.stepNames = [];
angular.forEach($scope.steps, function(isComplete, stepName){
     $scope.stepNames.push({stepName: stepName, isComplete: isComplete});
});

И затем перебрать это, но было бы неплохо сделать все это в представлении

Ответы

Ответ 1

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

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

Ответ 2

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

$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/

Ответ 3

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

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

Вот сценарий этого: http://jsfiddle.net/zMjVp/

Ответ 4

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

Сохраняет ли она информацию одной компании?

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

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

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

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

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

Ответ 5

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

Из Angularjs docs:

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

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

Ответ 6

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