Question

我正在尝试将数据从json提要传递到html文件，但下面的代码无效。

app.component.html

<ul *ngFor="let unit of units">
  <li>
    {{unit.details.count}} // getting data OK result -> 5642
  </li>
  <li>
    {{unit.cars.vehicle_id}} // not getting data
  </li>
</ul>

units_feed.json

[{"details":{"count":"5642"},"cars":[{"vehicle_id":"2056437754"},{"vehicle_id":"2056437753"},{"vehicle_id":"2056356347"},{"vehicle_id":"2056437752"},{"vehicle_id":"2056395634"}]}]

Answer 1

您无法访问它，因为unit.cars是一个对象数组。如果您想要访问其中一个对象，即使用vehicle_id的对象，则可以使用{{unit.cars[0].vehicle_id}}。请注意[0]告诉它访问数组中的第一个项目，您可以查看其属性vehicle_id。

猜猜你必须做这样的事情

<ul *ngFor="let unit of units">
  <li>
    {{unit.details.count}} 
  </li>
  <li *ngFor="let car of unit.cars">{{car.vehicle_id}}</li>
</ul>

使用Angular2从json显示html文件中的数据

1 个答案: