Html 如何在单击时更改MaterialTable单元格内容？ 全局

嗨， 我试图在Angular 7中使用Angular材质。 我必须使用一个有一些数据的材料表我的问题是：有没有办法在单击时更改MatCell内容？ 例如，考虑上面HTML中的表，用人的姓名、年龄和电话。

角度材质表HTML

---

有人能帮我吗？

您可以使用带有某种标志的

*ngIf

在所选电话号码之间进行交换。例如，如果组件中有类似的内容：

selectedPerson:Person;

…您的模板中可以有类似的内容：

...
<ng-container matColumnDef="phone">
    <mat-header-cell *matHeaderCellDef mat-sort-header>Phone Number</mat-header-cell>
    <mat-cell *matCellDef="let person">
        <span *ngIf="selectedPerson !== person" (click)="selectedPerson = person">
            {{person.phone}}
        </span>
        <input *ngIf="selectedPerson === person" matInput [value]="person.phone"(focusout)="changePhone($event.target.value, person)" placeholder="Phone">
    </mat-cell>
</ng-container>
...

。。。
电话号码
{{person.phone}
...

谢谢，成功了！我不知道为什么我以前没有这个想法，哈哈，很高兴听到！祝你申请顺利。

selectedPerson:Person;

...
<ng-container matColumnDef="phone">
    <mat-header-cell *matHeaderCellDef mat-sort-header>Phone Number</mat-header-cell>
    <mat-cell *matCellDef="let person">
        <span *ngIf="selectedPerson !== person" (click)="selectedPerson = person">
            {{person.phone}}
        </span>
        <input *ngIf="selectedPerson === person" matInput [value]="person.phone"(focusout)="changePhone($event.target.value, person)" placeholder="Phone">
    </mat-cell>
</ng-container>
...