我正在使用角材料垫表,我想在其中编辑列标题名称。假设列标题列表是姓名、年龄、性别等。用户想将标题名称的年龄重命名为出生日期,那么这怎么可能呢?我可以遵循哪个过程。
13z8s7eq1#
你可以显示列标题作为输入字段,但这可能会导致一个坏的UX。我建议使用一个图标(按钮)或双击事件来启用编辑:
您可以尝试:
... <ng-container [matColumnDef]="value"> <th mat-header-cell *matHeaderCellDef> <span *ngIf="!enableEditing" (dblclick)="enableEditing = true" style="cursor: pointer" > {{value | titlecase}} </span> <input *ngIf="enableEditing" type="text" [(ngModel)]="value" (keydown.enter)="editName()" (focusout)="editName()" /> </th> <td mat-cell *matCellDef="let element">{{element.name}}</td> </ng-container> ...
和editName()保存更改:
editName()
editName() { this.displayedColumns = ['position', this.value, 'weight', 'symbol']; this.enableEditing = false; }
1条答案
按热度按时间13z8s7eq1#
你可以显示列标题作为输入字段,但这可能会导致一个坏的UX。我建议使用一个图标(按钮)或双击事件来启用编辑:
您可以尝试:
和
editName()
保存更改: