How to remove the setTimeout and use async await method in angular

Question

If I removed the setTimeout form my below mentioned code then the blocks of code (getUnderlyingData) is running before the previous response. So I am not getting the proper response. Please anyone help me to resove this issue. Current code:

await this.TableauService.initViz(this.TableauViz, this.DataContainer, this.DataURL).then(([uniqData, TableauViz]) => {
    this.VizWorkbook = TableauViz;
    setTimeout(() => {
      this.SheetData = this.TableauService.getUnderlyingData(TableauViz, "KPI",(response) => {
        console.log("sheet data",response);
      }); 
    },7000);
  });
}

Answer 1

If you use await you don't need to use then to resolve the promise, await will do that for you.

An async function can contain an await expression that pauses the execution of the async function and waits for the passed promise's resolution after which it resumes the async function's execution and returns the resolved value.

async functionName(){
let result = await this.TableauService.initViz(this.TableauViz, this.DataContainer, this.DataURL)
}

The above result variable holds your resolved value with that you can do whatever you want.

Answer 2

Or you can simply add this line this.VizWorkbook = TableauViz; inside your getUnderlyingData(.. { this.VizWorkbook = TableauViz; ... }