Angular报错：类型Order[]不存在属性'id' 求助解决方案

你猜测的完全正确，问题根源就是组件中order的类型声明错误：

• 你通过getOrder(params['id'])获取的是单个订单对象，但组件里把order定义成了Order[]（订单数组类型）
• TypeScript会严格校验类型，数组本身没有id属性，所以模板中访问order.id时触发报错

修正步骤： #

1. 修改组件的order类型声明
   将数组类型改为单个Order对象，初始值设为null或undefined：

export class OrderDetailComponent {
  order: Order | null = null;

  private _getOrder() {
    this.route.params.subscribe((params) => {
      if (params['id']) {
        this.orderService
          .getOrder(params['id'])
          .subscribe((order) => {
            this.order = order;
            console.log(this.order);
          });
      }
    });
  }
}

2. 模板无需额外修改（可选）
   原模板中的*ngIf="order"可以正常判断单个对象是否存在，确保数据加载完成后再渲染：

<div class="admin-page" *ngIf="order">
  <p-card [header]="'View Order'" subheader="You can edit order status here">
    <h5>Order Id</h5>
    <p>{{ order.id }}</p>
  </p-card>
</div>

特殊情况处理 #

如果你的orderService.getOrder()接口返回的是包含单个订单的数组（即Observable<Order[]>），需要在订阅时取数组第一个元素赋值：

.subscribe((orders) => {
  this.order = orders[0];
});

内容的提问来源于stack exchange，提问作者ENN9