首页 > 解决方案 > 如何访问 Angular 中嵌套对象的属性?

问题描述

我有这个模型类。

export class Drivefunction{
public Injection: Injection;
public df_uid_machine_injsiz:string;
public Motor_Cable_IEC: Motor_cable;
...

在我的 display.component.ts 我有这个函数,它填充了我的 Drivefunction[]

fillDrivefunctions(){
  this.machineService.getDrivefunctions(this.injectionID)
    .subscribe((df:Drivefunction[])=> {
      this.drivefunctions = df;
      console.log(this.drivefunctions)
    });
}

如您所见,我尝试使用 console.log 来查看 json 对象是否正确填充

在此处输入图像描述

所有对象和嵌套对象都已填充!

在我的 HTML 中,我有一个带有 drivefunction[] 的 ngFor,我可以访问字符串等属性,但如果我尝试访问嵌套对象,即使它已正确填充,也会得到“无法读取未定义的属性”。

我是否必须“额外”订阅这个嵌套对象?

我的 HTML:

<ion-list *ngFor="let drivefunction of this.drivefunctions; ">
    <ion-item> 
       <ion-label>{{drivefunction.Injection.inj_uid_machine_injsiz}}</ion-label>
    </ion-item>
</ion-list>

标签: jsonangulartypescriptobjectnested

解决方案


我认为这是一个错字问题。

根据您提供的 HTML。

<ion-label>{{drivefunction.Injection.inj_uid_machine_injsiz}}</ion-label>

Bu 在控制台截图中,我们可以看到Injection是小写的。尝试

<ion-label>{{drivefunction.injection.inj_uid_machine_injsiz}}</ion-label>

并相应地更改Drivefunction类:

export class Drivefunction {
   public injection: Injection;
...

推荐阅读