如何仅将编辑后的数据保存在Angular材质可编辑表中

时间:2019-04-03 04:59:01

标签: angular angular-material

我是棱角材料的新手。我将所有数据从数据库加载到可编辑表中。现在我只想将已编辑的数据行更新到数据库中。如何在前端编写代码,我无法理解..所以请帮帮我

这是我的可编辑表格

<div>
<!-- table -->
<mat-table [dataSource]="dataSource">

  <ng-container matColumnDef="rider">
    <mat-header-cell *matHeaderCellDef> Rider </mat-header-cell>
    <mat-cell *matCellDef="let user"> {{user.occupationId}}</mat-cell>
  </ng-container>

  <ng-container matColumnDef="em_rate">
    <mat-header-cell *matHeaderCellDef> Em_Rate </mat-header-cell>
    <mat-cell *matCellDef="let user">
        <mat-form-field floatLabel="never">
            <input matInput placeholder="em_rate" [value]="user.emRate" [(ngModel)]="user.emRate">
        </mat-form-field>
    </mat-cell>
  </ng-container>

  <ng-container matColumnDef="rate_mil">
      <mat-header-cell *matHeaderCellDef> Rate_Mil </mat-header-cell>
      <mat-cell *matCellDef="let user">
          <mat-form-field floatLabel="never">
              <input matInput placeholder="rate_mil" [value]="user.rateMil" [(ngModel)]="user.rateMil">
          </mat-form-field>
      </mat-cell>   
  </ng-container>

  <ng-container matColumnDef="value">
      <mat-header-cell *matHeaderCellDef> Value </mat-header-cell>
      <mat-cell *matCellDef="let user">
          <mat-form-field floatLabel="never">
              <input matInput placeholder="value" [value]="user.value" [(ngModel)]="user.value">
          </mat-form-field>
      </mat-cell>
  </ng-container>

  <ng-container matColumnDef="sub_rate">
      <mat-header-cell *matHeaderCellDef> Sub_Rate </mat-header-cell>
      <mat-cell *matCellDef="let user">
          <mat-form-field floatLabel="never">
              <input matInput placeholder="sub_rate" [value]="user.subRate" [(ngModel)]="user.subRate">
          </mat-form-field>
      </mat-cell>
  </ng-container>

  <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
  <mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
</mat-table>

<br>
<br>
<button mat-button style=background:rgb(79,79,185);margin- 
left:10px;widows:15px; (click)="submit($event)"> Update </button>

</div>

所以我如何在ts文件中编码以完成任务。

0 个答案:

没有答案