Every day in this journey to dominate SSR with Angular Universal I end my work day facing new issues that keeps preventing my SPA from being properly indexed by search engines.
I'm using Angular 5.2.11 and all dependencies in the same version. Also, I'm using the transfer state module to prevent additional http calls in the browser app.
The problem that I've noticed is that when I perform a http get/post request that retrieves an array of results and I assign this array to a component variable to be rendered as a list with *ngFor directive, the server renders this list incomplete. The number of rendered results are random at each page reload, from almost 3 to less than the entire array length.
This is terrible, because Google won't know of all my existing urls, as at each attempt an incomplete and with a random number of results list is visible to it.
I'm making this request inside ngOnInit and calling it from a service, subscribing to it in the component and assigning the response to the component variable when I receive the success response.
By all I know *ngFor in Angular Universal should await for all async calls to be complete. I'm not using the async pipe with an Observable, because I need to trigger this request manually in my app architecture, but I've tested this approach already and it also won't work.
Does anyone know how to make the Universal server app always render the complete list from a http async call?
Thanks!