Как создать двустороннюю привязку в таблице данных Angular dynamici c? - PullRequest
0 голосов
/ 19 января 2020

Я использовал таблицу данных Dynami c, как показано ниже:

<table class="table table-striped table-hover" mat-table matSort (matSortChange)="sortData($event)" dir="rtl"
  [dataSource]="dataSource">
  <ng-container *ngFor="let column of columns" matColumnDef="{{column.columnDef}}">
    <div>
      <th mat-header-cell *matHeaderCellDef> {{column.label}}</th>
    </div>
    <td mat-cell *matCellDef="let row; let index = index" class="cells">
      <mat-form-field>
      <input matInput [placeholder]="column.label" [value]="column.cell(row, column)">
    </mat-form-field>
    </td>
  </ng-container>
  <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
  <tr (click)="showContent(row)" class="rows" mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>

, и это мой машинописный код для столбцов сборки и источника данных:

let mhd = {
    columnDef: eachColumns['columnName'],
    label: eachColumns['displayName'],
    cell: (row, c) => {
        return row[c.columnDef];
    }
};
this.columns.push(mhd)

this.displayedColumns = this.columns.map(c => c.columnDef);
this.dataSource = new MatTableDataSource(this.result);

Я изменяю данные ввода затем console.log (this.result), но в консоли я вижу Предыдущий объект.

если я изменяю на [(value)]="column.cell(row, column)", я получаю эту ошибку ниже в консоли:

core. js: 14597 Ошибка: ошибка (в обещании): ошибка: ошибки синтаксического анализа шаблона: ошибка синтаксического анализатора: неожиданный токен '=' в столбце 25 в [column.cell (row, column) = $ event] в ng: /// ReportModule / MainGridReportComponent. html@14: 51 ("= index" class = "ячейки">] [(значение)] = "column.cell (строка, столбец)"> "): ng: /// ReportModule / MainGridReportComponent. html@14: 51

1 Ответ

0 голосов
/ 19 января 2020

Правильно для двухстороннего связывания:

 [(ngModel)]="row[column.columnDef]"
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...