使用Angular 8向表中添加一行

// table.component.ts
import { Component } from '@angular/core';

interface TableRow {
  name: string;
  age: number;
}

@Component({
  selector: 'app-table',
  templateUrl: './table.component.html',
  styleUrls: ['./table.component.css']
})
export class TableComponent {
  tableData: TableRow[] = [
    { name: 'John', age: 25 },
    { name: 'Jane', age: 30 },
    { name: 'Bob', age: 35 }
  ];

  addRow() {
    const newRow: TableRow = { name: 'New Name', age: 0 };
    this.tableData.push(newRow);
  }
}

<!-- table.component.html -->
<table>
  <thead>
    <tr>
      <th>Name</th>
      <th>Age</th>
    </tr>
  </thead>
  <tbody>
    <tr *ngFor="let row of tableData">
      <td>{{ row.name }}</td>
      <td>{{ row.age }}</td>
    </tr>
  </tbody>
</table>

<button (click)="addRow()">Add Row</button>