将Javascript中的JSON值读取到多个级别

我有一个JSON对象数组，如下所示：

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

    <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>

在HTML文件中，我循环遍历数组，如下所示：

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

    <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和名称。我正确获取了员工id和员工姓名。我得到info.address的空输出。正在将info.address读取为字符串。

请提及您的元素，如：

{
    id: 'info.address',
    header: 'Employee address',
    value: 'info.address'
  }

或：

---

根据您的逻辑，valie和id应该相同，以定位标题。

我想您可以制作一个指令或函数来实现您想要的功能：

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;
}

---

我建议你喜欢json*

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

及

*你只能使用

   this.columns.forEach(x=>{
      x.value=x.value.split('.')
   })

---

您无法访问地址信息的属性。类似地址。您所做的工作相当于行[info.address]，而不是分层搜索直接查找属性info.address。假设我有一个具有多个级别的JSON，{id:'address'，header:'Employee address'，value:['info'，'address'，'street'，…]}，有没有办法在数组上循环，看看Tim的答案——或者其他类似的函数——在.html插值中，您可以使用少量运算符。也许可以创建一个自定义管道。

   this.columns.forEach(x=>{
      x.value=x.value.split('.')
   })