根据角度与angularjs显示数组元素

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>

这很可能是因为您的电子邮件数组正在异步加载，因此在您的服务返回之前它是null。用？这使得它不会尝试访问“电子邮件地址”。属性直到其定义，因此不会在负载时抛出错误。

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>