使用 ng-repeat 遍历作为数组的值
Iterate over values which are arrays with ng-repeat
给定以下对象:
{
key1: ["val1","val2","val3","val4"],
key2: ["val2","val5","val22","val4","val8","val1"],
key3: ["val1"],
key4: ["val11","val12"]
}
是否可以使用 ng-repeat 一次性遍历所有值?
我的动机是:
1. 我在 <tr>
标签中使用 ng-repeat,它不能放在 <tbody>
中,我需要在 table 中为每个值创建一行,例如:
<tr>
<td>key1.val1</td>
</tr>
<tr>
<td>key1.val2</td>
</tr>
<tr>
<td>key1.val3</td>
</tr>
<tr>
<td>key1.val4</td>
</tr>
<tr>
<td>key2.val2</td>
</tr>
<tr>
<td>key2.val5</td>
</tr>
... and so on ...
- 我不知道高级键或值。我通过 API
得到它们
有什么想法吗?
谢谢!
由于您的键是对象的属性,因此我会在第一步中将其转换为数组:
$scope.keys = [];
for (var property in object) {
if (object.hasOwnProperty(property)) {
$scope.keys.push(object.property);
}
}
然后您可以使用嵌套的 ng-repeat 指令显示所有值:
<div ng-repeat="key in keys">
<div ng-repeat="val in key[$index]">
{{val}}
编辑: 还有一种方法可以直接遍历对象属性
<div ng-repeat="(key, value) in myObj"> ... </div>
如记录here:
$scope.allValues = [];
angular.forEach(object, function(array) {
array.forEach(function(value) {
$scope.allValues.push(value);
});
});
然后只需在 allValues
上使用 ng-repeat。
给定以下对象:
{
key1: ["val1","val2","val3","val4"],
key2: ["val2","val5","val22","val4","val8","val1"],
key3: ["val1"],
key4: ["val11","val12"]
}
是否可以使用 ng-repeat 一次性遍历所有值?
我的动机是:
1. 我在 <tr>
标签中使用 ng-repeat,它不能放在 <tbody>
中,我需要在 table 中为每个值创建一行,例如:
<tr>
<td>key1.val1</td>
</tr>
<tr>
<td>key1.val2</td>
</tr>
<tr>
<td>key1.val3</td>
</tr>
<tr>
<td>key1.val4</td>
</tr>
<tr>
<td>key2.val2</td>
</tr>
<tr>
<td>key2.val5</td>
</tr>
... and so on ...
- 我不知道高级键或值。我通过 API 得到它们
有什么想法吗?
谢谢!
由于您的键是对象的属性,因此我会在第一步中将其转换为数组:
$scope.keys = [];
for (var property in object) {
if (object.hasOwnProperty(property)) {
$scope.keys.push(object.property);
}
}
然后您可以使用嵌套的 ng-repeat 指令显示所有值:
<div ng-repeat="key in keys">
<div ng-repeat="val in key[$index]">
{{val}}
编辑: 还有一种方法可以直接遍历对象属性
<div ng-repeat="(key, value) in myObj"> ... </div>
如记录here:
$scope.allValues = [];
angular.forEach(object, function(array) {
array.forEach(function(value) {
$scope.allValues.push(value);
});
});
然后只需在 allValues
上使用 ng-repeat。