向Angular Material Table中的MatCell添加自定义多行HTML内容

<mat-table [dataSource]="dataSource">
  <!-- 定义表格列 -->
  <ng-container matColumnDef="column1">
    <mat-header-cell *matHeaderCellDef> Column 1 </mat-header-cell>
    <mat-cell *matCellDef="let element">
      <!-- 在这里添加自定义多行HTML内容 -->
      <div>
        <p>行1</p>
        <p>行2</p>
        <p>行3</p>
      </div>
    </mat-cell>
  </ng-container>

  <!-- 其他列的定义 -->

  <!-- 表格行 -->
  <mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
</mat-table>

import { Component } from '@angular/core';

@Component({
  selector: 'app-table',
  templateUrl: './table.component.html',
  styleUrls: ['./table.component.css']
})
export class TableComponent {
  displayedColumns: string[] = ['column1', 'column2', 'column3'];
  dataSource = [
    { column1: 'Value 1', column2: 'Value 2', column3: 'Value 3' },
    // 其他数据行
  ];
}