使用Mat-table进行内联文本编辑：

Question

有没有人有一个很好的解决方案，可以向列中添加内联文本编辑，您可以在其中编辑和保存并使用mat table重新编辑，如本示例所示： https://material.io/design/components/data-tables.html#behavior 看来它仍然是gitHub上的未解决问题：https://github.com/angular/material2/issues/5982

Answer 1

在您的matColumnDef内部，您应该有一个<th></th>和一个<td></td>，只需使用反应形式将输入添加到<td></td>中即可。

---

如果您希望与示例实际相同，则可以在位置相对元素内创建一个position absolute元素，该元素将在单击，接收和输入以及在经过某些逻辑后关闭时提示更新formControl。

仍然，您需要formControls并编辑matColumnDef。

示例来自github请求的链接

      <ng-container matColumnDef="time">
        <th mat-header-cell *matHeaderCellDef> time </th>
        <td mat-cell *matCellDef="let element; let i = index" [formGroupName]="i"> 
            <input type="text" formControlName="time" placeholder="Time"> 
        </td>
      </ng-container>

Answer 2

您提到的git hub问题有一些人们想出的实现方式。

您可以从中获得启发：

https://stackblitz.com/edit/material2-beta12-es19ub?file=app%2Fapp.component.html

或此： https://stackblitz.com/edit/angular-g5u7cy?file=app%2Ftable-editing-example.html

我将遍历github问题，以了解人们提出的不同选择。