Javascript 无法读取属性'；名字'；未定义的

我有这个问题

无法读取未定义的属性“first_name”

这是我的HTML文件checkout.HTML

名字
....

只要加上一个引号，我想会有帮助的

<ion-input type="text" [(ngModel)]="newOrder?.billing.first_name"></ion-input>

---

您似乎正在加载newOrder异步。 结果，页面被呈现，但异步任务尚未完成

您在构造函数中声明了

this.newOrder.billing={}

。 正因为如此，他现在尝试读取html中的

newOrder.billing.first\u name

。

newOrder.billing

是一个空对象，因此那里没有

名字

只有异步任务完成后，此数据才会存在。但目前Angular在这之前抛出了一个错误

有两种非常常见的方法来处理这样的情况

您可以告诉模板，它不应使用缺少的数据渲染零件

<ion-item *ngIf="newOrder.billing">
  <ion-label>First Name</ion-label>
  <ion-input type="text" [(ngModel)]="newOrder.billing.first_name"></ion-input>
</ion-item>


名字

然后，*ngIf将看到变量未定义，模板的这一部分不会显示在DOM=>no error:-）
一旦异步任务完成，变量就不再是未定义的，模板部分将显示出来

另一种方法（当您只想显示数据时更常见）是使用

{{newOrder.billing.first_name | async}}

异步管道还将确保Angular能够处理这个问题。
结合[ngModel]，我认为异步管道将无法工作。但也许值得一试

温馨问候
您可以在插值中使用对象的引号，如
@海怪

但@JanRecker提供了两种解决方案：
如果在插值中使用异步管道，它将不起作用，因为这适用于
可观测rxjs

因此，添加引号确实是一个有用的选择。
显然
计费
属性是
未定义的
类似错误提示。这是异步的，所以模板是在数据到达之前呈现的。当然，它可能是
未定义的
，原因是该道具不存在，但我猜问题是第一个问题。newOrder内部是什么？我已经在构造函数this.newOrder={}中声明了它；this.newOrder.billing={}；this.newOrder.shipping={}；this.billing\u shipping\u same=false；好的，那么您获取的数据可能不存在
账单
属性。与NullPointer所评论的一样，在分配数据之后，
newOrder
的内容是什么？。。。如果
账单
是一个空对象，它怎么能同时是
未定义的
？；）：-）True:-），因此替代方法是“JSON.parse（data.body.customer）”返回未定义的