* ngFor - 无法动态渲染项目 - Angular 6 - Mat-menu按钮

Question

到目前为止，

  this.ItemList = [{
    "item1":"value-1".
    "item2":"value-2".
    "item3":"value-3".
    "item4":"value-4".
    }];

<button mat-button mat-raised-button color="warn" [matMenuTriggerFor]="menu" (click)='dummyBtn($event)'>List of values</button>
  <mat-menu #menu="matMenu" *ngFor = "let list of ItemList">
    <button mat-menu-item>Item 1</button>
    /*<button mat-menu-item>Item 2</button>
    <button mat-menu-item>Item 2</button>*/
  </mat-menu>

我在控制台中没有看到任何错误。 但同时，值不会被渲染，相反，它只显示硬编码值。

有人可以告诉我如何实现这一目标吗？ 现有的stackblitz示例似乎很难生成动态元素。 或者我的做法真的不可能吗？

请不要在没有任何理由的情况下进行投票。 我遇到过几个例子，那些现在没有帮助，谢谢你们

Answer 1

你可以试试看，让我知道结果吗？

<mat-menu #menu="matMenu" *ngFor = "let list of ItemList">
<button mat-menu-item>{{list}}</button>
/*<button mat-menu-item>{{list}}</button>
<button mat-menu-item>{{list}}</button>*/
</mat-menu>

Answer 2

感觉最糟糕。 我只是犯了一个愚蠢的错误，

1. 在函数内声明一个变量，因此'let abc'的范围不是函数的活动。

2. 声明的var不是数组

我只是纠正了上述错误。 现在按预期工作

Answer 3

在ts文件和html中声明objectKeys = Object.keys ，

<button mat-button [matMenuTriggerFor]="menu">Menu</button>
<mat-menu #menu="matMenu">
  <button mat-menu-item *ngFor="let key of objectKeys(ItemList[0])">
    {{ ItemList[0][key] }}
  </button>
</mat-menu>