使用 Angular 数组显示键和值

Question

我在 Angular 中有一个这样的数组：

$scope.test = [
  {'item1' : 'answer1' },
  {'item2' : 'answer2' },
  {'item3' : 'answer3' }
];

等等……

现在我想做两件事。首先，我想使用 ng-repeat 遍历数组并分别显示键和值。我试过这个：

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

但这会产生如下结果：

0  = {"item1" : "answer1"}
1  = {"item2" : "answer2"}
2  = {"item3" : "answer3"}

而我希望它像这样显示：

item1  = answer1
item2  = answer2
item3  = answer3

我想做的第二件事是使用键来显示来自不同数组的结果。例如我有这个数组：

$scope.item1.question = 'some question';

所以当我正在经历 ng-repeat 时，我想做这样的事情：

{{key}}.question

显示字符串'some question'。

但这并没有做任何事情......

Answer 1

1。使用嵌套的ng-repeats。

ng-repeat 只是循环遍历数组，所以它写出元素的索引作为键。您需要嵌套另一个 ng-repeat 来迭代包含的对象：

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

2。使用方括号表示法和对象包装器。

要使用来自ng-repeat 内另一个对象的动态键访问对象，请使用允许表达式的数组表示法：

$scope.model = {
    item1: {
        question : 'some question 1'
    },
    item2: {
        question : 'some question 2'
    },
    item3: {
        question : 'some question 3'
    }
}; 

HTML：

<div>
    {{ model[key].question }}
</div>

Fiddle