单击按钮以角度上传搜索结果数据

Question

我对Angular有项目要求。我使用搜索选项，当我单击添加按钮时，能够从外部api搜索数据并在其下方显示用户。我尝试使用angular primeng自动完成功能来实现。

但是问题在于，根据此处的屏幕截图https://imgur.com/a/wXYqOpM

当我单击“上传列表”时，所有显示的用户数据都应通过单击按钮上传（作为文件或数组）。既然我是新手，那么您能帮我找到合适的解决方案吗？

预先感谢 帕特里克

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
    });
  }
}

希望会有所帮助-问候

编辑-将API调用移至函数中，单击按钮即可调用