我有一个JSON对象数组,如下所示:

columns: [{
    id: 'id',
    header: 'Employee ID',
    value: 'id'
  },
  {
    id: 'name',
    header: 'Employee Name',
    value: 'name'
  },
  {
    id: 'address',
    header: 'Employee address',
    value: 'info.address'
  },
]


在HTML文件中,我如下遍历数组:

    <ng-container *ngFor="let eachCol of columns" matColumnDef="{{eachCol.id}}">
      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{eachCol.header}}</th>
      <td mat-cell *matCellDef="let row">
         {{ row[eachCol.value] }}
      </td>
    </ng-container>


这适用于最高1级的JSON值,即适用于ID和名称。我正确地获得了员工编号和员工姓名。我得到“ info.address”的空输出。 “ info.address”被读取为字符串。

最佳答案

我想您可以根据自己的需要创建指令或函数:

function pathToValue(obj, path) {
    const parts = path.split(".");
    let currentValue = obj;

    for(let i=0; i<parts.length; i++) {
        if (currentValue.hasOwnProperty(parts[i])) {
            currentValue = currentValue[parts[i]];
        }
    }

    return currentValue;
}


并在模板中使用它:

{{ pathToValue(row, eachCol.value) }}

关于javascript - 读取Javascript中的JSON值多达多个级别,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/59932301/

10-12 12:49
查看更多