Currently, I am utilizing Angular to create a user interface that interacts with a REST API. Within the function below, my process involves adding a new project via a POST request, followed by the addition of a series of aliases inputted by the user in the form. Subsequently, these aliases are added to the project and then the selected apps list is retrieved where their IDs are located and finally added to the project. Take a look at the following post calls:
addProject(name: string, description: string): void {
// Adding a new project
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'];})
// Adding the aliases
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'];});
// Adding aliases to the new project
let UrlAliasToProject = this.baseUrl + `/projects/${newProjectId}/alias`;
this.httpClient.post(UrlAliasToProject, {"alias_id" : newAliasId}, httpOptions)
.subscribe((data: any) => { console.log("alias added to project");});
};
// Adding the selected applications to the new project
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 });
};
}
The issue arises when attempting to retrieve the values for newProjectId and newAliasId. The error message encountered is as follows:
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" }
Although I can successfully log the values using console.log, they appear as undefined outside of this context.