Загрузить данные результатов поиска в угловом формате одним нажатием кнопки

Question

У меня есть требования к проекту на Angular. Я использую опцию поиска, где я могу искать данные из внешнего API и отображать пользователя под ним при нажатии на кнопку Добавить. Я попытался реализовать с помощью углового primeng автозаполнения

Но проблема в том, что согласно скриншоту здесь https://imgur.com/a/wXYqOpM

Когда я щелкаю на Upload List, все отображаемые пользовательские данные должны быть загружены одним нажатием кнопки (в виде файла или массива). Так как я новичок в angular, можете ли вы помочь мне найти подходящее решение для того же?

Спасибо заранее Патрик

Answer 1

Для правильного, полного ответа на ваш вопрос требуется немного больше информации.Я просто сделаю пару предположений для этого.

Я полагаю, что у вас есть массив пациентов / пользователей в вашем файле .ts и выведите эти данные в ваш .html, используя интерполяцию данных.Примерно так:

upload-list.component.ts:
...
public userList = ['Patient 1', 'Patient 2', 'Patient 3']
...

upload-list.component.html:
...
<your-list-display>{{ userList }}</your-list-display>
<button (click)='sendData()'>Upload list</button>

В конце концов, все, что вам нужно сделать, это вставить HttpClient (импортированный из @ angular / common / http) в конструктор вашего компонента и использовать его (желательно в службе, читая вв частности, angular.io описывает, как обмениваться данными между компонентами и т. д.).

В общих чертах, что-то вроде этого должно работать:

upload-list.component.ts:
import { HttpClient } from '@angular/common/http';

...

export class UserList {
  constructor(private http: HttpClient) {}

  public sendData(): void {
    this.http.post<any>(apiURL, this.userList).subscribe(result => {
      ... // do something with the result from your HTTP request.
    }, error => {
      ... // handle error as wished
    });
  }
}

Надеюсь, это поможет1011 *

РЕДАКТИРОВАТЬ - перенес вызов API в функцию, которая будет вызываться при нажатии кнопки