Извлечение данных из PrimeNG с данными - PullRequest
0 голосов
/ 29 апреля 2018

У меня возникла небольшая проблема с функцией, которую я хочу включить. Когда пользователь выполняет поиск, он заполняет таблицу результатами. Я хочу, чтобы они могли удалить эту строку, кнопка "Delete" включена.

Вот мой стол: https://github.com/BillyCharter87/Tech-O-Dex-UI/blob/58ba15188a490a9c867e0727e56c3efa0a9f6b1e/src/app/table/table.component.html#L21-L25

Мой console.logs не показывает, что что-либо взято со стола, кроме

 MouseEvent {isTrusted: true, screenX: 81, screenY: 615, clientX: 81, clientY: 524, …}

и мой API обнаруживает null объекта, который он должен получить для удаления. Есть какие-нибудь указатели на это? Кажется, я немного растерялся, и два часа исследований не были для меня плодотворными.

Спасибо

1 Ответ

0 голосов
/ 30 апреля 2018

Это потому, что вы передаете два аргумента методу onDelete($event, tech) в шаблоне, но в компоненте onDelete(value: any) определен только один параметр. Таким образом, значение устанавливается на $event, которое в данном случае является MouseEvent, поскольку кнопка привязана к событию click.

Из документации $ событие и операторы обработки события :

Форма объекта события определяется целевым событием. Если целевое событие является собственным событием элемента DOM, тогда $ event является объектом события DOM со свойствами, такими как target и target.value.

Если вам не нужна информация из объекта $event, удалите ее из вызова к onDelete() в шаблоне.

<p-column header="Action">
  <ng-template let-tech="rowData" pTemplate="body">
    <button type="text" pButton label="Delete" (click)="onDelete(tech)"></button>
  </ng-template>
</p-column>

Тогда метод onDelete() в компоненте получит значение строки таблицы.

public onDelete(value: Tech) {
  console.log(value);
  this.tableService.deleteRegistrant(value)
    .subscribe(
      value => {
        console.log('[POST] create Registrant successfully', value);
      }, error => {
        console.log('FAIL to create Registrants!');
      },
      () => {
        console.log('POST Registrants - now completed.');
      });
  this.submitted = true;
}
...