Отправка идентификатора методу нажатием кнопки в таблице материалов в Angular - PullRequest
Новая
       71

Отправка идентификатора методу нажатием кнопки в таблице материалов в Angular

0 голосов
/ 25 мая 2020

У меня есть следующая таблица материалов enter image description here Код для «Действия» приведен ниже: 

    <ng-container matColumnDef="Action">
      <th mat-header-cell *matHeaderCellDef> Action</th>
        <td mat-cell *matCellDef="let element">
          <i class="material-icons mat-icon-button" (click)="greeting(element)">open_in_new</i> </td>
  </ng-container>

Каждая строка этой таблицы имеет связанный Special_Id в базе данных, которую я получаю с помощью вызова GET REST, вместе со всеми этими данными, но не отображается в пользовательском интерфейсе и, следовательно, не является частью столбца этой таблицы материалов.

Код для интерфейса выглядит следующим образом: 

export interface PeriodicElement {
  special_id:string;
  name: string;
  position: number;
  weight: number;
  symbol: string;
}

код для столбца таблицы материалов: 

displayedColumns: string[] = ['position', 'name', 'weight', 'symbol','Action'];

При нажатии кнопки действия, соответствующей каждой строке вызывается метод приветствие (элемент) . Моя задача состоит в том, чтобы передать Special_Id в качестве параметра методу приветствия. Как я могу этого добиться? AngularJS для меня довольно ново, и я не могу понять, как это сделать.

Ответы [ 2 ]

1 голос
/ 25 мая 2020

Вы пробовали: 

<ng-container matColumnDef="Action">
  <th mat-header-cell *matHeaderCellDef> Action</th>
  <td mat-cell *matCellDef="let element">
    <i class="material-icons mat-icon-button" 
       (click)="greeting(element.special_id)">
      open_in_new
    </i> 
  </td>
</ng-container>

Также можно установить ссылку в строке 

<ng-container matColumnDef="Action">
  <th mat-header-cell *matHeaderCellDef> Action</th>
  <td mat-cell *matCellDef="let element" (click)="greeting(element.special_id)">
    <i class="material-icons mat-icon-button">
      open_in_new
    </i> 
  </td>
</ng-container>
0 голосов
/ 25 мая 2020

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

...