Angular 获取6中POST请求的响应_Angular_Typescript_Httpclient

Angular 获取6中POST请求的响应

angular typescript

Angular 获取6中POST请求的响应,angular,typescript,httpclient,Angular,Typescript,Httpclient,我正在使用angular创建一个与API REST通信的用户界面。在下面的函数中，我首先通过post请求添加一个项目，然后在表单中添加用户输入的别名列表，然后将别名添加到项目中，然后获取所选应用的列表，查找它们的ID，然后将它们添加到项目中。以下是帖子： addProject(name: string, description: string): void { // Ajouter un nouveau projet let newProjectId: number;

我正在使用angular创建一个与API REST通信的用户界面。在下面的函数中，我首先通过post请求添加一个项目，然后在表单中添加用户输入的别名列表，然后将别名添加到项目中，然后获取所选应用的列表，查找它们的ID，然后将它们添加到项目中。以下是帖子：

addProject(name: string, description: string): void {

    // Ajouter un nouveau projet
    let newProjectId: number;
    let newAliasId: number;
    let url = this.baseUrl + "/projects";
    this.httpClient.post<Project>(url,
        {'name': name, 'description': description }, 
        httpOptions).subscribe((data: any) => { newProjectId = data['result']['id'];})

    // Ajouter les alias 
    for (let entry of this.aliasList) {
        let UrlAddAlias = this.baseUrl + "/alias";
        this.httpClient.post(UrlAddAlias, {'alias': entry }, httpOptions)
        .subscribe((data: any) => { newAliasId = data['result']['id'];});
        // Ajouter les alias au nouveau projet
        let UrlAliasToProject = this.baseUrl + `/projects/${newProjectId}/alias`;
        this.httpClient.post(UrlAliasToProject, {"alias_id" : newAliasId}, httpOptions)
        .subscribe((data: any) => { console.log("alias added to project");});
    };

    // Ajouter les applications selectionnées au nouveau projet
    for (let entry of this.selectedApps) {
        let Urlapp = this.baseUrl + `/apps/name/${entry}`;
        let appId;
        this.httpClient.get(Urlapp).subscribe(data => { appId = data['result']['id']; });
        let urlappToProject = this.baseUrl + `/projects/${newProjectId}/apps`;
        this.httpClient.post(urlappToProject, {'app_id': appId });
    };
}

addProject（名称：string，描述：string）：无效{
//新青年项目
设newprojectd:number；
让newAliasId:number；
让url=this.baseUrl+“/projects”；
此.httpClient.post（url，
{'name'：name，'description'：description}，
订阅（（数据：any）=>{newProjectId=data['result']['id']；}）
//阿杰尔斯别名
for（让输入此.aliasList）{
让UrlAddAlias=this.baseUrl+“/alias”；
this.httpClient.post（UrlAddAlias，{'alias'：entry}，httpOptions）
.subscribe（（数据：any）=>{newAliasId=data['result']['id']；}）；
//Ajouter les alias au nouveau projet
让URLASIASTOPROJECT=this.baseUrl+`/projects/${newProjectId}/alias`；
this.httpClient.post（UrlAliasTopProject，{“alias_id”：newAliasId}，httpOptions）
.subscribe（（数据：any）=>{console.log（“添加到项目的别名”）；}）；
};
//A外部应用程序选择新项目
for（让我们输入此.selectedApps）{
让Urlapp=this.baseUrl+`/apps/name/${entry}`；
让appId；
this.httpClient.get（Urlapp.subscribe）（数据=>{appId=data['result']['id']；}）；
让urlappToProject=this.baseUrl+`/projects/${newProjectId}/apps`；
this.httpClient.post（urlappToProject，{'app_id'：appId}）；
};
}

问题是我无法检索newProjectId值和newAliasId值。我得到这个错误：

Object { headers: {…}, status: 405, statusText: "Method Not Allowed", url: "http://api.com/v1/projects/undefined/alias", ok: false, name: "HttpErrorResponse", message: "Http failure response for http://api.com/v1/projects/undefined/alias: 405 Method Not Allowed", error: "<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 3.2 Final//EN\">\n<title>405 Method Not Allowed</title>\n<h1>Method Not Allowed</h1>\n<p>The method is not allowed for the requested URL.</p>\n" }

对象{头：{…}，状态：405，状态文本：“不允许使用方法”，url:http://api.com/v1/projects/undefined/alias，ok:false，名称：“HttpErrorResponse”，消息：“Http失败响应http://api.com/v1/projects/undefined/alias: 405方法不允许”，错误：“\n405不允许使用方法\n不允许使用方法\n请求的URL不允许使用该方法。\n”}

我可以通过

控制台.log

获取值，但在其他地方它们是

未定义的。
订阅回调是异步进行的。这意味着在它之后写入的代码仍将在它之前执行…类似于设置超时

setTimeout(() => console.log('second'));
console.log('first');

基本上，您可以将所有内容放在.subscribe
的.subscribe
之后：
.subscribe((data: any) => {
  newProjectId = data['result']['id'];

  for (let entry of this.aliasList) { ...
});

如果可能的话，您可能还需要重新编写API，以避免发出多个请求，并让post
自行处理所有事情。
我的问题是，尽管我可以在subscribe by console.log中获取newProjectId的值，但为什么newProjectId未定义？因为您是异步设置的