Angularマテリアルテーブルセルに画像を表示

Question

マテリアルテーブルのセルに画像を表示しようとしています。したがって、私は自分のHTMLファイルでこのコードを試しました：

<ng-container matColumnDef="ImageUrl">
  <mat-header-cell *matHeaderCellDef> imageUrl </mat-header-cell>
  <mat-cell *matCellDef="let element"> {{element.imageUrl}} </mat-cell>
  <img [src]="imageUrl" />
</ng-container>

残念ながら、私のテーブルには何も表示されません。

Answer 1

これを試してみてください：

<ng-container matColumnDef="imageUrl">
  <th mat-header-cell *matHeaderCellDef> Image Url </th>
  <td mat-cell *matCellDef="let element"> <img [src]="element.imageUrl" /> </td>
</ng-container>

---

これが、参考用の Working Sample StackBlitz です。