Angular async data

Tags: #<Tag:0x00007f8b2b75a180>

Hi,
in Angular when I’m calling my function that has settings object straight from ngOnInit() and the sample data is created on the fly all seems to be working fine, but when I’m executing that settings function asynchronously then grid is always empty. What would be the right approach if I need to wait for the data that is coming from API with some delay?
Thank you.

Hey @argo.argishtin

Please share the demo with the latest progress. You can use this demo as a starting point https://jsfiddle.net/Lryd8kot/1/

For example this:

the grid is empty because it waits for async function’s promise. Once you remove “.then(() => { … }” the grid loads data normally. So the question is how should I load the data that comes asynchronously, with some time delay, from some API for example.
Thank you.

Update 1: Ok, I made it work after I change the order of calls. If instead of waiting for async function return I call the function that assigns hot table settings from inside of that async function then it all works fine.
Thank you.

Update 2: no, unfortunately it works only if there is no delay. Consider this simplified version of that page.

It works only if refreshGrid is called right away. If we call with some delay (comment out that line and uncomment setTimeout line) the grid is empty. How do I solve this if my data is coming from webapi with some delay?
Thanks again for your help.

Looks like the trick is to specify datasource in html file ( [data]=“HerosObject” ) instead of the settings in .ts then it works as expected.

Thank you for the quick update. I’m glad that you found a way to make it work.