Question

我在Web项目上使用JHipster Framework。我是新手，所以我有一些问题。我尝试从按钮到后端实现API调用。我想要按下Resolve按钮，当它被点击以调用方法时，此方法将转到服务以进行实际的API调用。现在有问题了。当我在我的服务中访问resolveFile方法时，我得到所有警报但不是API调用。当我尝试直接访问Postman的后端时，它运行良好。问题似乎出现在 myFile.service.ts 文件中。你有什么建议吗？

myFile.component.html：

<button (click)="resolveFile(myfile.id)" class="btn-dark btn btn-sm">
    <span class="fa fa-beer"></span>
    <span class="d-none d-md-inline" >Resolve</span>
</button>

myFile.component.ts：

resolveFile(id) {
    alert('mpika1');
    this.myfileService.resolveFile(id);
}

myFile.service.ts

private resourceUrl = SERVER_API_URL + 'api/my-file/resolve';
resolveFile(id: String): Observable<EntityResponseType> {
    debugger;
    alert();
    this.http.get(`${this.resourceUrl}/${id}`);
    alert();
    return null;
}

myFileResource.java

@GetMapping("/my-file/resolve/{id}")
public ResponseEntity<MyFileDTO> resolveFile(@PathVariable String id)
{
    log.debug("REST request to resolve myFile: {}", id);

    // TODO
    myService.resolveFile(id);
    return null;
}

Answer 1

你必须订阅它。

this.http.get(`${this.resourceUrl}/${id}`).subscribe((res) =>{
  //res -> response output
});

Angular使用名为 rxjs 的库，了解更多信息https://angular.io/guide/rx-library

为了更好地实施，最好返回Observable而不是返回null

<强> myFile.service.ts

private resourceUrl = SERVER_API_URL + 'api/my-file/resolve';
resolveFile(id: String): Observable<EntityResponseType> {
    return this.http.get(`${this.resourceUrl}/${id}`);
}

<强> myFile.component.ts

resolveFile(id) {
   //In here you could wait the response
    this.myfileService.resolveFile(id).subscribe((res) =>{
      //res -> response output
      alert('mpika1');
    });;
}

Answer 2

在angular中使用observable时，为了让它们被执行而必须订阅它。

 resolveFile(id) {
    alert('mpika1');
    this.myfileService.resolveFile(id).subscribe(reslt => {
 // to see the result 
console.log(rslt) 
});
}

Jhipster - Angular HTTP Get请求永远不会执行

2 个答案: