typescript 从Angular 创建动态列表时出错

fcwjkofz  于 2023-02-20  发布在  TypeScript
关注(0)|答案(1)|浏览(100)

我试图从Angular 创建一个动态表,我的想法是创建一个函数,用户输入行数和列数,并从这些值,创建一个表的行数和列数,用户已经定义。问题是,当我想插入一个单元格的每个位置'i',标签打印字面上,并没有创建一个表代码:
超文本标记语言

<div class="container" id="tabla">
    {{table}}
</div>

类型脚本

export class tableMaker implements OnInit {
  table: string = '';
  amount: number = 10;

  constructor() {
  }

  dinamicTable(amount: number) {
    this.table = `<table>`;

    for (let i = 0; i < amount; i++) {
      this.table += `
      <tr>
        <td>7</td>
      </tr>
      `;
    }
    this.table += '</table>';
  }
}

这就是我在裤子上的印象:(https://i.stack.imgur.com/weOO7.png
我希望能够打印一个表格,表格中的每个"i"位置都有一个单元格

k5ifujac

k5ifujac1#

使用单向流语法属性绑定:
<div [innerHTML]="table"></div>
来自Angular 文档:Angular将该值识别为不安全值并自动清理,这将删除标记,但保留安全内容(如元素)。

相关问题