使用Angular2获取JSON中的嵌套子对象_Json_Angular_Typescript

使用Angular2获取JSON中的嵌套子对象

json angular typescript

使用Angular2获取JSON中的嵌套子对象,json,angular,typescript,Json,Angular,Typescript,我正在处理内部孩子的json数据。我需要获取json中的所有名称 json数据 this.res = [ { "children": [ { "children": [ { "children": [],

我正在处理内部孩子的json数据。我需要获取json中的所有名称

json数据

this.res = [  
                  {
                    "children": [
                      {
                        "children": [
                          {
                            "children": [],
                            "name": "P Sub Child 3",
                          },
                          {
                            "children": [
                              {
                                "children":[],
                                "name" : "data"
                              }
                            ],
                            "name": "PSubChild2",
                          }
                        ],
                      "name": "PChild1",
                      },
                      {
                        "children": [
                          {
                            "children": [],
                            "name": "PSubChild3",
                          }
                        ],
                        "name": "PChild2",
                      }
                    ],
                    "name": "Parent1",
                  },
                  {
                  "children": [],
                  "name": "Parent2",
                  }
    ];

在我的应用程序中，每个孩子的名字都必须使用angular2存储在变量中。

数据是根据我的应用程序中的用户进行动态更改的

创建您自己的数据类型：

export class MyNode {
  children:Array<MyNode>;
  name:string;
}

导出类MyNode{
子：数组；
名称：字符串；
}

然后创建一个方法递归地循环您的父母，以获取他们的名字和孩子的名字

parents:Array<MyNode> = [
    {
      "children": [
        {
          "children": [
            {
              "children": [],
              "name": "P Sub Child 3",
            },
            {
              "children": [
                {
                  "children":[],
                  "name" : "data"
                }
              ],
              "name": "PSubChild2",
            }
          ],
          "name": "PChild1",
        },
        {
          "children": [
            {
              "children": [],
              "name": "PSubChild3",
            }
          ],
          "name": "PChild2",
        }
      ],
      "name": "Parent1",
    },
    {
      "children": [],
      "name": "Parent2",
    }
  ];

 names:Array<string>=[];
 getAllNames(){
    this.getNameHelper(this.parents);
 }
 getNameHelper(parents:Array<MyNode>){
    for(var p of parents){
      if(p.name){
        this.names.push(p.name);
      }
      if(p.children){
        this.getNameHelper(p.children);
      }
    }
  }

父级：数组=[ { “儿童”：[ { “儿童”：[ { “儿童”：[…]， “名称”：“P子项3”， }, { “儿童”：[ { “儿童”：[…]， “名称”：“数据” } ], “名称”：“PSubChild2”， } ], “名称”：“PChild1”， }, { “儿童”：[ { “儿童”：[…]， “名称”：“PSubChild3”， } ], “名称”：“PChild2”， } ], “名称”：“父项1”， }, { “儿童”：[…]， “姓名”：“父母2”， } ]; 名称：数组=[]； getAllNames（）{ this.getnameheloper（this.parents）； } getNameHelper（父级：数组）{ 用于（父母的var p）{ 如果（p.name）{ this.names.push（p.name）； } 如果（p.儿童）{ this.getnameheloper（p.children）； } } }

下面是一个可能实现的示例

创建您自己的数据类型：

export class MyNode {
  children:Array<MyNode>;
  name:string;
}

导出类MyNode{
子：数组；
名称：字符串；
}

然后创建一个方法递归地循环您的父母，以获取他们的名字和孩子的名字

parents:Array<MyNode> = [
    {
      "children": [
        {
          "children": [
            {
              "children": [],
              "name": "P Sub Child 3",
            },
            {
              "children": [
                {
                  "children":[],
                  "name" : "data"
                }
              ],
              "name": "PSubChild2",
            }
          ],
          "name": "PChild1",
        },
        {
          "children": [
            {
              "children": [],
              "name": "PSubChild3",
            }
          ],
          "name": "PChild2",
        }
      ],
      "name": "Parent1",
    },
    {
      "children": [],
      "name": "Parent2",
    }
  ];

 names:Array<string>=[];
 getAllNames(){
    this.getNameHelper(this.parents);
 }
 getNameHelper(parents:Array<MyNode>){
    for(var p of parents){
      if(p.name){
        this.names.push(p.name);
      }
      if(p.children){
        this.getNameHelper(p.children);
      }
    }
  }

据我所知，您只想从分层数据中获取

名称

属性的值，然后，正如这里大部分建议的那样，您必须使用递归来获取

名称

属性。使用Rxjs，可以更轻松地执行以下操作：

Observable.from(this.res)
.expand(d => d.children.length > 0 ? Observable.from(d.children) : Observable.empty())
.subscribe(d => console.log(d.name));

我在这里做了一个工作示例：

据我所知，您只想从分层数据中获取

name

属性的值，然后，正如这里大多数人建议的那样，您必须使用递归来获取

name

属性。使用Rxjs，可以更轻松地执行以下操作：

Observable.from(this.res)
.expand(d => d.children.length > 0 ? Observable.from(d.children) : Observable.empty())
.subscribe(d => console.log(d.name));

我在这里制作了一个工作示例：

我在angularjs中找到了一个示例，但我想在Angular2中找到它。到目前为止，您尝试了什么也将帮助您在将来自己解决此类问题。@evolutionxbox我尝试了许多方法，但无法获得内部子节点。您可以创建自己的数据类型，例如

MyNode

，其中包含子节点（

Array childen

）和名称属性（

nodeName:string

）。然后您可以创建一个递归查找数据对象中所有名称的方法。@NunnaS我添加了一个可能的实现作为答案。希望它对你有用，并且你能理解。我在angularjs中找到了一个例子，但是我想在Angular2中找到它，到目前为止你试过什么也将帮助您在将来自己解决此类问题。@evolutionxbox我尝试了许多方法，但无法获得内部子节点。您可以创建自己的数据类型，例如

MyNode

，其中包含子节点（

Array childen

）和名称属性（

nodeName:string

）。然后您可以创建一个递归查找数据对象中所有名称的方法。@NunnaS我添加了一个可能的实现作为答案。我很高兴我能帮上忙：）我很高兴我能帮上忙：）