There's a code snippet triggered on an HTML page when clicked:
public salaryConfirmation() {
const matDialogConfig: MatDialogConfig = _.cloneDeep(GajiIdSettings.DIALOG_CONFIG);
this.warningNameList = [];
for(let i=0; i < this.kelolaDataPenggajianInfoDataKaryawanList.length; i++) {
const positionClassId = this.selectedKaryawanAllData[i].position.positionClass.id;
const beginYearMonth = this.inputForm.get('bulanBerlaku').value;
const gajiPokok = this.kelolaDataPenggajianInfoDataKaryawanList[i].gaji;
this.structureAndSalaryScaleValidationService.getSalaryRange(positionClassId, beginYearMonth, gajiPokok)
.pipe(takeUntil(this.ngUnsubscribe))
.subscribe(
async (result) => {
this.uiBlockService.hideUiBlock();
if(result.status == 'warning') {
if(result.warnings[0].code == 'trxMutasiKaryawan.confirmation.alert') {
await this.warningNameList.push(this.kelolaDataPenggajianInfoDataKaryawanList[i]);
}
}
},
(error) => {
this.uiBlockService.hideUiBlock();
this.contentAlertService.error(error.errors);
},
() => { this.uiBlockService.hideUiBlock(); }
)
}
matDialogConfig.data = this.warningNameList;
console.log("this.warningNameList.length :", this.warningNameList.length);
if (this.warningNameList.length > 0) {
this.save();
} else {
this.inputMassalGajiWarningComponentDialogRef = this.dialog.open(InputMassalGajiWarningComponent, matDialogConfig);
this.inputMassalGajiWarningComponentDialogRef.afterClosed().subscribe(
(confirm: boolean) => {
if (confirm) {
this.save();
}
}
);
}
}
The issue is that the length of the this.warningNameList variable always shows as "0" in the result.
I understand that this should work asynchronously, but I'm unsure how to implement it in TypeScript. I've tried placing await inside the loop, but it doesn't seem to work due to incorrect placement.
I came across a reference regarding JavaScript async and await in loops while researching this issue.
Any help on this matter would be greatly appreciated. Thank you!