如何使用 *Ngfor 动态添加 Angular <div> 或其他 html 元素答案

【问题标题】：how to add in Angular dynamically <div> or another html elements using *Ngfor如何使用 *Ngfor 动态添加 Angular <div> 或其他 html 元素
【发布时间】：2022-11-29 23:41:46
【问题描述】：

需要在Angular中动态添加or元素例如：


import { Component } from '@angular/core';
@Component({
  selector: 'my-app',
  template: `
    <ul>
      <li *ngFor="let movie of Movies">
      <div class="left"></div>
        {{ movie.name }}

      </li>
    </ul>
    `
})
export class RecentlyAddedComponent  {





    Movies: any[] = [
    {
      "name": "Avengers: Endgame"
    },
    {
      "name": "Good Boys"
    },
    {
      "name": "Playmobil: The Movie"
    },
    {
      "name": "Aquarela"
    },
    {
      "name": "Aladdin"
    }, 
    {
      "name": "Downton Abbey"
    },
    {
      "name": "Downton Abbey"
    }
 
 ];

 items =["Tom", "Bob", "Sam", "Bill"];

}

没问题，但我需要添加例如 div 或按钮元素。我怎样才能做到这一点？谢谢）我的数组项 - 仅适用于字符串元素

例如在列表的每个位置内

<div>
<button>
</div>

example

【问题讨论】：

您的问题不清楚，当您说动态时，其背后的逻辑是什么？
请解释一下这个想法，决定因素应该是什么，添加什么以及何时添加
编辑您的问题以回答在 cmets 中发布的问题。答题区是为你原问题的答案预留的
您在搜索 Inner Html 吗？

标签： angular typescript

【解决方案1】：

例如在列表的每个位置内

<div>
<button>
</div>

example

【讨论】：