Within an Angular 2 form, the task at hand is to fetch the first name and last name through a http get call. This call requires a user_id, which is obtained from a previous http get call made to another endpoint.
Although there are concerns regarding similar issues with async http get calls, none of the existing solutions have proven to be truly effective in this case.
The initial call retrieves the user_id field without sending any additional parameters to the server:
/API/system/session/unusedid
This call returns the following information -->
{"user_name":"rgar003","session_id":"0635400936","is_technical_user":"false","user_id":"403"}
With the retrieved user_id (403), it's now possible to make another call to a different endpoint and retrieve the corresponding userName and lastName:
/API/identity/user/403 //403 or whatever the user_id is
This call provides the following data -->
{"job_title":"dsf","userName":"rgar003","lastname":"Garcia","firstname":"Robert"}
The objective now is to display the first name and last name within a disabled form input. Currently, only the user_id is being displayed.
The template featuring the disabled field where the name and lastmane should appear:
<div class="col-sm-5">
<label for="petitioner">Petitioner</label>
<input [(ngModel)]="data.petitioner" type="text" class="form-control" name="petitioner" disabled>
</div>
The component home houses a function that is responsible for loading the petitioner's user_id from the backend:
constructor(private workflowService: WorkflowService, private parametersService: UrlParametersService, private _ref: ChangeDetectorRef) {
this.formMode = parametersService.formMode;
// origin: /API/system/session/unusedId
this.workflowService.loadPetitioner().subscribe(
res => {
this.data.petitioner= res;
}
);
The workflow.service class holds the aforementioned function:
constructor(private http: Http, private parametersService: UrlParametersService, private router: Router, private _configurations: ConfigurationsService) {}
public loadPetitioner(): Observable<string> {
return this.http.get("/API/system/session/unusedId", {withCredentials: true}).map(value => value.json().user_name);
}
Various chaining methods were attempted, all of which proved unsuccessful.
However, If a direct call is made to /API/identity/user/403 with the user_id hardcoded, the retrieval of the first name + last name functions as intended. Here's how:
getPetitionerFirstNamePlusLastName(): Observable<string>{
return this.http.get("/API/identity/user/403", {withCredentials: true}).map(value =>(value.json().firstname + " " + value.json().lastname));
}
An asynchronous issue appears to persist, despite efforts to address it by examining related problems.