OnInit Block with readCSV subscribe/observable function yields inconsistent results

I have an Angular OnInit block inside my "Dashboard.component" that reads a CSV file and populates a web page. If my webpage is called from my "Home.Component" web page, then the webpage populates with data from my CSV file (everything works as expected). If I go to my "Dashboard" webpage directly, the values from my CSV file are not on my web page -- yet I have buttons on my data that I can click on and display the CSV Data. So my readCSV with a subscribe and observable, is not executing before my web page loads when "dashboard.component" is called directly.

My Dashboard component is a "standalone: true" component.

I'm confused on how to fix.

ngOnInit() {


try {

for (let xd = 0; xd < 10; xd++) {

this.readCSV('../../assets/json/stu1.csv').subscribe(data => {

this.csvData = data;
TECHNIQUENAME[xd] = 'my techniquename';
TACTIC[xd] = this.csvData[xd]['last_name'];
});
}
}
catch (e) { alert("exception is: " + e); }


}

Continue reading...