Need to load the data while form get displaying, all the data should be set in the controller,...

In the form which values need to be set in controller, those values should be loaded after the spinner , and during form loading ,I have tried to use async and await,

but after form get displayed those values loading one by one, I need during the form load that values need to be set in the controller

//html file

<app-pbc-spinner *ngIf="pageSpinner" [overlay]="true" [showNavBar]="true">

//ts file

export class NewUser{
ngOnInit() {
this.pageSpinner=true;
this.setupUserRequestPage();
this.createForm();
this.initRefData();
this.pageSpinner=false;
}


//this call setting the request
setupUserRequestPage() {
this.getRefNumber();
this.getUserRequestFormData(this.user);
}

setUserData(data) {
//this.userRequestForm.controls.requestControl.setValue(data.firstName + ' ' +data.lastName);
//this.userRequestForm.controls.statusControl.setValue(data.id);
this.userRequestForm.controls.statusControl.setValue(RefDataService.getRefDtoFormListByCode(this.userStatusList, "OPEN"));
this.userRequestForm.controls.assigneeControl.setValue(ASSIGNEE.FIRST_NAME + ' ' + ASSIGNEE.LAST_NAME);
}

//getting reference number and set it in refcodeControl
getRefNumber() {
this.userRequestSubscription = this.userService.getRequestReferenceNumber().subscribe(
response => {
this.userRequestForm.controls['refCodeControl'].setValue(response.code);
this.RequestReferenceNumber = this.userRequestForm.controls['refCodeControl'].value;
},
() => {
this.toaster.error("error in generating unique Reference Number", '', TOASTR_TIMEOUT);
}
);
}




createForm() {
this.userRequestForm = this.userFormBuilder.group(
{
CodeControl: [{ value: '', disabled: true }],
requesControl: [{ value: '', disabled: true }],
// projectIdControl: new FormControl('', Validators.required),
statusControl: [{ value: '', disabled: true }],
assigneeControl: [{ value: '', disabled: true }],
descriptionControl: [{ value: '', disabled: false }, Validators.required],

}
);

}



//Passing the response to setUserData
getUserRequestFormData(user) {
const userdata = this.service.getData(user).toPromise().then(response => {
// console.log(response);
this.setUserData(response);
}
);
console.log(userdata);

}



async initRefData() {

this.selectevalue = await this.sharedService.pn();
this.sharedService.Ebm(this.selectevalue).subscribe(
(response) => {
this.currentUser = response;
this.userRequestForm.controls.requesControl.setValue(EBMDtoUtil.getEbmName(this.currentUser));

}

);

}
}

Continue reading...