In my Angular component, I have a method that retrieves data using HttpClient subscription. The data is then assigned to an attribute called this.allData. After that, an empty parameter dictionary is instantiated based on this data and passed to another function:
export class TestComponent implements OnInit {
allData: object[] = []
activeData: object = {}
constructor(private http: HttpClient) { }
ngOnInit(): void {
this.getData()
this.makeRequestBasedOnData()
}
getData() {
this.http.get(this.url).subscribe(res => {
for (let datum of res["data"]) {
this.allData.push({
"key": Object.keys(datum)[0],
"values": Object.values(datum)[0]
})
this.activeData[Object.keys(datum)[0]] = "";
}
})
}
makeRequestBasedOnData() {
let testParams = this.activeData
console.log(testParam)
}
}
I want these operations to occur in sequence. Currently, the testParams logged in makeRequestBasedOnData() displays an empty object {}. Attempting to return arbitrarily within the first method results in a TypeScript error stating that a promise cannot be assigned to type void.
How can I ensure synchronicity in this scenario even though neither method returns anything?