*ngFor语言 - 无法动态渲染项目 - 角度 6 - 垫子菜单按钮



到目前为止,

  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>

我在控制台中没有看到任何错误。 但同时值没有被呈现,相反,它只是显示硬编码的值。

有人可以告诉我如何实现这一目标吗? 现有的堆栈闪电战示例似乎使生成动态元素变得复杂。 还是我的方法真的不可能做到这一点?

请不要无缘无故地投反对票。我遇到了几个例子,到目前为止这些例子没有帮助谢谢<</p>

div class="one_answers">

你能试试这个,让我知道结果吗?

<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>

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

  1. 在函数内声明一个变量,因此 'let abc' 的作用域不会脱离函数。

  2. 声明的 var 不是数组

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

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>

最新更新