无法访问我的对象中的数组

Question

我是 Angular 的新手（从 AngularJS 迁移）

我正在调用一个返回带有子文档（数组）的对象的 api。

api返回的对象基本是：

contact:{
  first_name:'Bob',
  last_name:'smith',
  phones:[
    {
      phone_number:'222-222-2222'
      phone_type:'home'
    },
    {
      phone_number:'333-333-3333'
      phone_type:'mobile'
    },
  ]
}

在我的 html 中，我可以调用 {{contact.first_name}}

但如果我尝试像这样执行 '*ngFor'：

*ngFor="let phone of contact.phones"

我收到一个编译错误，说它找不到“未定义”的“电话”。

这对我来说没有意义，因为我知道“联系人”不是未定义的，我可以看到返回了完整的对象。

我错过了什么？

Answer 1

由于您是通过异步调用从 api 请求，因此您需要使用 *ngIf 或使用安全导航运算符来确保数据可用

*ngFor="let phone of contact?.phones"