循环使用JSON键和值

这看起来很简单，但是我不能像我想的那样循环浏览这些项目

我有这个json对象

"meters":{  
      "Rozvadec M11":{  
         "0":{  
            "Name":"m11-mcu13_sm114",
            "Title":"Svarovaci centrum Flexarc",
            "Parent":"m11-mcu13",
            "Status":"Running",
            "State":false
         },
         "1":{  
            "Name":"m11-mcu13_sm115",
            "Title":"Brousici centrum Solicad",
            "Parent":"m11-mcu13",
            "Status":"Running",
            "State":false
         }
      },
      "Rozvadec R1-L":{  
         "0":{  
            "Name":"r1-l-mcu1_sm100",
            "Title":"Amada NCT1",
            "Parent":"r1-l-mcu1",
            "Status":"Device unavailable",
            "State":false
         },
         "1":{  
            "Name":"r1-l-mcu1_sm101",
            "Title":"Amada 1",
            "Parent":"r1-l-mcu1",
            "Status":"Device unavailable",
            "State":false
         },
         "2":{  
            "Name":"r1-l-mcu1_sm102",
            "Title":"Amada 2",
            "Parent":"r1-l-mcu1",
            "Status":"Device unavailable",
            "State":false
         }
      },

我想做的是循环通过所有的仪表，得到一个

"Rozvadec M11"
"Rozvadec R1-L"

并且在每个下都有一个不同smartmeters名称的列表

我有这个在ts里

let list =  this.http.get('EndpointURL');
         list.subscribe (
           (response: Response)=> 
           {this.meters.push(response);
           console.log(this.meters);
         })

这是html格式的（在嵌套for循环之前，我首先尝试只循环米）

{{meter}}

您的大部分代码都是正确的，但ngFor不是这样使用的。带有ngFor的html标记将被重复，这就是为什么您应该在

li

中使用它，而不是在列表标记

ul

中使用它的原因。对你来说是这样的：

<ul>
    <li *ngFor="let meter of meters">
        {{meter}}
    </li>
<ul>

{{meter}}

本文将介绍这个确切的例子

编辑：如果您想访问列表的键，在这里您可以看到Angular6中检索它的新方法。对于您的示例，结果将如下所示：

<ul>
    <li *ngFor="let meter of meters | keyvalue">
        {{meter.key}}
    </li>
<ul>

{{meter.key}}

---

当我尝试在html输出中提供（[object object]）时，您可以在.

中阅读有关

keyValuePipe

的更多信息！这就是我困惑的原因！是的，听起来不错。您可以使用：

{{meter.0.name}

访问对象内部的一些数据，也可以使用JSON管道打印对象：

{{meter | JSON}}

。

<ul>
    <li *ngFor="let meter of meters | keyvalue">
        {{meter.key}}
    </li>
<ul>