JChartFX pie chart drawing before data has been returned

[saDSI]

The goal is to have a pie chart that is drawn when the page loads using data from my database.  I am using Angular typescript for the front end.

The relevant section of code is as follows:

pieData; //the object I intend to load the pie chart data into

...

ngOnInit() {
this.getPieData(); //calls the database and loads the results into pieData
console.log(this.pieData);
this.createPieChart(); //creates the pie chart, based on the information in pieData
}

When that runs, the pie chart drawn uses seemingly random data, but the console readout prints out the pieData correctly, so I know getPieData is working the way it should.  When I've put some random console.log commands into getPieData and createPieChart, I've learned that createPieChart seems to be running before getPieData.

I've tried using Promises to force it to wait for the data:

pieData;

ngOnInit() {
    new Promise ((resolve, reject) => {
        this.getPieData();
        resolve();
    })
    .then(() => {this.createPieCharts();})
}

but the same thing occurs.

I have tried preloading some data into pieData, and in that case it only ever displays the preloaded data.

How can I consistently force getPieData to run before createPieCharts?