如何从JSON数组中获取数据并在表中显示数据？

Question

所以在数据库中我们有jsonChanges：string []参数。 Json看起来像......

"{"field":"referringPhysician","oldValue":"Medical oncologist","newValue":"Clinical oncologist"}"

在我的情况下，我需要在我的角度组件表中显示oldValue和newValue。 编辑后用户自动保存到数据库中的这个值作为old和newValue但只在一个string []参数内。我需要以某种方式从这个数组中提取这些值并显示它们。

1 - 我的桌子

    <table class="listing">
            <thead>
              <th class="table-column-min">User Name</th>
              <th class="table-column-min">Modified Date</th>
              <th class="table-column-min">Entity Name</th>
              <th class="table-column-min">Old Value</th>
              <th class="table-column-min">New Value</th>
            </thead>
            <tbody>
           <tr *ngFor="let at of auditTrailList | paginate: { itemsPerPage: _ITEMS_PER_PAGE, currentPage: crtPage, totalItems: totalItems }"
        [attr.data-row-id]="at.userId">
        <td>{{ at.userName }}</td>
        <td>{{ at.timestamp ? (at.timestamp | date:  CUSTOM_DATE_FORMAT ) :  'Unknown' }}</td>
        <td>{{ at.entityName }}</td>
        <td>TODO: old value</td>
        <td>TODO: new value</td>
      </tr>
    </tbody>

2 - 我的组件

    getList(patientId?: number, pageNo?: number) {
       const auditTrailSubscription = 
   this._auditTrailService.getAuditTrailUrl(patientId, pageNo, 
  GridConfig.ITEMS_PER_PAGE)
     .subscribe(
       result => {
          this.getPersonId();
          this.auditTrailList = result.lstRecords;
          this.totalItems = result.recordsCount;
       },
       err => {
        this.handleError(err);
      }
    );

  this.addSubscription("auditTrail", auditTrailSubscription);
}

Answer 1

当你有这个数组时，你可以存储在组件中的变量中并传递给你的html文件，例如： this.allData={ "field":"referringPhysician", "oldValue":"Medical oncologist", "newValue":"Clinical oncologist" }

在您的HTML中，您可以显示如下：

<td>{{allData.oldValue}}</td>
<td>{{allData.newValue}}</td>