javascript - 我找到了如何在 typescript 中制作表格，但我不知道如何将其插入到html代码中

Question

我找到了如何在 typescript (Angular 5)中制作html表格，但我不知道如何在html代码中添加它。我唯一看到的是[object HTMLTableElement]，我通过{{table}}在html代码中放置了一个表格。

感谢您的帮助。

我的表代码:

private table: HTMLTableElement;
  private thead: HTMLTableSectionElement;
  private tbody: HTMLTableSectionElement;


  constructor() {
    this.table = document.createElement('table');
    this.thead = <HTMLTableSectionElement> this.table.createTHead();
    this.tbody = <HTMLTableSectionElement> this.table.createTBody();
    var hrow = <HTMLTableRowElement> this.table.tHead.insertRow(0);
    var cell = hrow.insertCell(0);
    cell.innerHTML = "Module ID";
  }

Answer 1

如果您确定您的表格有效，您可以将其与 Angular 一起使用:

<table [innerHTML]="table"></table>

或者(因为我在你的代码中看到其他变量)

<table>
  <thead [innerHTML]="thead"></thead>
  <tbody [innerHTML]="tbody"></tobdy>
</table>

这是 Angular 的指令选择器，它将标记的内部 HTML 设置为您提供的变量。