首页 文章

如何使用angular2深度嵌套的json值

提问于
浏览 次
1

我试图从深层嵌套的json对象中获取 Value .

我尝试使用管道，我成功获取键和值，但它们不是我想要获得的正确的键和值 .

任何人都可以帮助我如何ng我在下面写下的 Value 观 .

data: {
category:[
{0:{one:'test1', **two**:'test2'}},
{1:{one:'test3', **two**:'test4'}},
{2:{one:'test5', **two**:'test6'}}
]
number:[]
]
}

我想要'两个'的 Value ！

我目前有管道

import { Pipe, PipeTransform } from '@angular/core';

`@Pipe({name: 'keys'})
export class KeysPipe implements PipeTransform {
  transform(value, args:string[]) : any {
    let keys = [];
    for (let key in value) {
      keys.push({key: key, value: value[key]});
    }
    return keys;
  }
}

在我的组件模板中，我有

<div *ngFor="let one of theme | keys">
  <div *ngFor = " let two of one.key | keys">
    <div *ngFor = "let three of two.key>
         <p id="thm-title">{{three.value['two']}}</p>
    </div>
  </div>
</div>
json angular pipe

1 回答

  • 2

    您的管道按预期工作，您只需要对 *ngFor 循环进行一些更改

    您问题中的对象和对象，所以我假设您的数据结构如下 . 此循环将输出 test2 test4 test6

    data = {
    category: [
        { 0: { one: 'test1', two: 'test2' } },
        { 1: { one: 'test3', two: 'test4' } },
        { 2: { one: 'test5', two: 'test6' } }
    ]
}

    HTML

    <div *ngFor="let one of data | keys">
    <div *ngFor="let two of one.value">
        <div *ngFor="let three of two | keys">
            {{ three.value['two'] }}
        </div>
    </div>
</div>
    回复于

相关问题