在角度与角度的视图中显示数组元素

Question

在 AngularJS 中，当我想在我的视图中显示数组中的特定元素时，我会简单地像这样引用它：

<span>{{contact.emails[0].email_address}}</span>

但是由于某种原因，在 Angular 中使用相同的设置时，我收到错误：

Runtime Error
Cannot read property 'email_address' of undefined

因此，如果我返回一个包含电子邮件数组的联系人对象，如何引用数组上的第一项？

Answer 1

试试这个：

<span>{{contact.emails[0]?.email_address}}</span>

这很可能是因为您的电子邮件数组正在异步加载，因此在您的服务返回之前它是空的。用？这样它就不会尝试访问"email_address"属性，直到它定义，因此不会在加载时抛出错误。

Answer 2

也许你应该尝试做一个

console.log(contact.emails[0])

因为此错误意味着数组的第一项不存在。

否则，如果它存在，它会像那样工作！

<span>{{contact.emails[0].email_address}}</span>

Answer 3

Try this: 

<ng-template [ngIf]='contact.emails && contact.emails.length > 0'>
  <span>{{contact.emails[0].email_address}}</span>
</ng-template>