我正在学习 AngularJS。我想打印出一个对象列表并迭代对象的内部对象的属性之一。这看起来像是使用嵌套循环的标准过程,然而,它似乎并不那么简单。
我的 Controller 设置如下。本质上,它是一个随机车辆列表。
var vehicleApp = angular.module("vehicleApp", []);
vehicleApp.controller('VehicleController', function ($scope) {
$scope.vehicles = [{
id: 0,
name: "car",
parts: {
wheels: 4,
doors: 4
}
}, {
id: 1,
name: "plane",
parts: {
wings: 2,
doors: 2
}
}, {
id: 2,
name: "boat",
parts: {
doors: 1
}
}];
});
我想这样输出车辆:
car
- wheels (4)
- doors (2)
plane
- wings (2)
- doors (2)
boat
- doors (1)
我使用的模板是这样设置的:
<div ng-app="vehicleApp" ng-controller="VehicleController">
<p ng-repeat="vehicle in vehicles">
{{ vehicle.name }}
</p>
<ul>
<li ng-repeat="(attribute, value) in vehicle.parts">
{{attribute}} ({{value}})
</li>
</ul>
</div>
这会生成车辆列表,但不会生成部件内部对象的子列表。
有趣的是,当我使用
{{ vehicle.parts }}
时就足够了它返回部件内部对象的 JSON 字符串。 AngularJS 是否将其视为字符串,因此无法打印出部件对象的属性?
最佳答案
您没有附上第二个 ngRepeat
在第一个:
<div ng-app="vehicleApp" ng-controller="VehicleController">
<p ng-repeat="vehicle in vehicles">
{{ vehicle.name }}
<ul>
<li ng-repeat="(attribute, value) in vehicle.parts">
{{attribute}} ({{value}})
</li>
</ul>
</p>
</div>
关于angularjs - 如何在 AngularJS 模板中迭代内部对象的属性?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20621211/