有条件地在HTML表格中插入一行(Angular)

<table>
  <thead>
    <tr>
      <th>列1</th>
      <th>列2</th>
      <th>列3</th>
    </tr>
  </thead>
  <tbody>
    <tr *ngFor="let row of tableData">
      <td><input type="text" [(ngModel)]="row.column1"></td>
      <td><input type="text" [(ngModel)]="row.column2"></td>
      <td><input type="text" [(ngModel)]="row.column3"></td>
    </tr>
  </tbody>
</table>

export class YourComponent {
  tableData: any[] = [
    { column1: '值1', column2: '值2', column3: '值3' },
    { column1: '值4', column2: '值5', column3: '值6' },
    // 其他默认行数据...
  ];

  // 在组件中定义一个方法来插入新行
  insertRow() {
    const newRow = { column1: '', column2: '', column3: '' };
    this.tableData.push(newRow);
  }
}

<button (click)="insertRow()">插入新行</button>