如何使用 REST API 从数据库获取数据到 angular 中的下拉列表

Question

我创建了一个 API 来获取所有服务，我想将服务的名称放在下拉列表中，我已经测试了这段代码，但它不起作用！

HTML

<div class="col-lg-6">
     <select name="Service" 
      class="form-control">
     <option>-- Select Services --</option>
     <option [value]="serv.service_name" *ngFor="let serv of ServiceList">
       {{ serv.service_name}}
     </option>
   </select>
</div>

TS

ServiceList: any;
ngOnInit(): void {
this.serviceService.getAllServices().subscribe((data: any)=>{
  this.ServiceList = data;
  //console.log(this.services);
})  
}

它没有从数据库中获取数据！

Answer 1

由于您的控制台中没有错误，因此您的下拉列表为空的唯一原因是您的data实际上是一个空数组，即[] 。

添加console.log(data); 并检查您的 API 返回的内容。

编辑：

根据您的评论，您的 API 返回：

[{…}] 0: {..., name_service: 'AAAA', ...} length: 1 [[Prototype]]: Array(0)

该属性被命名为name_service而不是service_name ，因为您在 HTML 模板中使用它...