如何在 angular material table 中显示嵌套对象内的数据

Question

显示公司名称的数据我应该怎么做，因为我不知道为什么它显示未定义。我想我以正确的方式做，因为它的对象，所以我需要的只是使用“。”但是当我试图显示公司名称时，（姓名、生日、城市等）的数据都消失了，但如果我试图显示“element.profile.current_job”，它显示的是 [object OBJECT] 和这些（姓名、生日、城市等）数据仍然显示。

JSON 文件

{
  "Profile": {
    "name": "John",
    "birthDate": "2020-07-03 00:00:00.000",
    "city": "L.A",
    "current_job": {
      "companyName": "Company",
      "position": {
        "positionName": "Manager",
        "time": {
          "start": "2020-07-03 00:00:00.000",
          "till": "2020-07-03 00:00:00.000"
        }
      }
    },
    "gender": "Female",
    "status": "Single"
  }
}

HTML

//1 success show [object OBJECT]
<ng-container matColumnDef="companyName">
    <th mat-header-cell *matHeaderCellDef mat-sort-header>Company Name</th>
    <td mat-cell *matCellDef="let element">
       {{ element.Profile.current_job }}
    </td>
</ng-container>

//2 failed "Cannot read property 'companyName' of undefined"
<ng-container matColumnDef="companyName">
    <th mat-header-cell *matHeaderCellDef mat-sort-header>Company Name</th>
    <td mat-cell *matCellDef="let element">
       {{ element.Profile.current_job.companyName }}
    </td>
</ng-container>

//3 success show L.A 
<ng-container matColumnDef="city">
    <th mat-header-cell *matHeaderCellDef mat-sort-header>City</th>
    <td mat-cell *matCellDef="let element">
        {{ element.Profile.city }}
    </td>
</ng-container>

Answer 1

您可以使用下面的代码

{{ element.Profile.current_job ? element.Profile.current_job.companyName : ''}}

如何在 angular material table 中显示嵌套对象内的数据

how to displaying data inside nested object in angular material table

angular-material

angular

angular-material-table