如何使用 ngFor 循环打字稿中的类 Map 变量？

【问题标题】：How do I use ngFor to loop over a classes Map variable in typescript?如何使用 ngFor 循环打字稿中的类 Map 变量？
【发布时间】：2021-04-08 05:39:57
【问题描述】：

我有一个名为 myMap 的类，它有一个名为 navList: Map 的变量，其中包含多个键值。这个类位于我的 ts 文件中。我正在尝试使用 ngFor 遍历 html 文件中的 navList 值，但我不确定它是如何完成的。抱歉，我没有提供我的代码的屏幕截图，我还很新，不知道该怎么做。感谢您的帮助。

【问题讨论】：

使用 .values() 是对地图值的无错误developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…

标签： angular typescript

【解决方案1】：

您可以使用KeyValuePipe。将 Object 或 Map 转换为键值对数组。

{{ input_expression | keyvalue [ : compareFn ] }}

例子：

<div *ngFor="let item of map | keyvalue">
  {{item.key}}:{{item.value}}
</div>

【讨论】：