Как изменить элемент td таблицы угловых данных с {{element [column]}} на поле формы ввода - PullRequest
0 голосов
/ 30 ноября 2018

Итак, у меня есть таблица данных угловых материалов, которая динамически заполняется столбцами и данными из файла json.У меня каждая строка заполняется с использованием interpolaton -> {{element[column]}} прямо сейчас внутри стандартного td элемента.Когда я нажимаю на строку, я могу выделить эту конкретную строку, но я хочу изменить td с {{element[column]}} на form.Итак, в основном Я хочу изменить эту одну конкретную строку на элемент form при щелчке строки .Я не уверен, как подойти к этому.

Я пытался использовать ngIf для переключения между ng-шаблонами, но это меняет каждую строку, когда я нажимаю на строку.Я только хочу изменить элемент html строки, на которую я специально щелкнул.Любая помощь или руководство будут оценены.На самом деле я не могу загрузить какой-либо код из-за ограничений моих компаний, но я могу использовать приведенный ниже код для отображения своей проблемы.

У меня есть

<ng-container [matColumnDef]="column" *ngFor="let column of displayedColumns">

    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{column}} </th>
    <td mat-cell *matCellDef="let element">
        {{element[column]}}
    </td>
</ng-container>

Я хочу изменить текущий элемент td, когда я нажимаю на определенную строку на form с input, но только на эту конкретную строку,не все ряды.

1 Ответ

0 голосов
/ 30 ноября 2018

Предлагаю разделить таблицу и содержание.Поэтому определите новый компонент, представляющий содержимое вашей ячейки, которое по щелчку преобразуется в форму.

См., Например: https://stackblitz.com/edit/angular-q46mwh

...