Angular Universal将与httpClient相处吗？

Question

I am currently working on a project which is built mainly based on NgModules. We have 5 different modules and multiple components and services in that. When we tried to enable server-side rendering using Angular Universal, the pages are not rendered completely. The code which is given below is the only part which is rendered. (view source)

This issue is happening when we use httpClient in the code. Without that everything works perfectly.

<app-root _nghost-sc0="" ng-version="8.1.2"><router-outlet _ngcontent-sc0=""></router-outlet><app-main _nghost-sc1=""><!----></app-main></app-root> 

But if we check in browser's developer tools, we could see

<app-root _nghost-serverapp-c0="" ng-version="8.1.2"><router-outlet _ngcontent-serverapp-c0=""></router-outlet><app-main _nghost-serverapp-c1=""><!--bindings={
  "ng-reflect-ng-if": "[object Object]"
}--><div _ngcontent-serverapp-c1="" id="home-page"><app-banner _ngcontent-serverapp-c1="" _nghost-serverapp-c2="" ng-reflect-banners="[object Object],[object Object"><p _ngcontent-serverapp-c2="">banner works!</p></app-banner><app-counter _ngcontent-serverapp-c1="" _nghost-serverapp-c3="" ng-reflect-counters="[object Object],[object Object"><p _ngcontent-serverapp-c3="">counter works!</p></app-counter><app-categories _ngcontent-serverapp-c1="" _nghost-serverapp-c4="" ng-reflect-categories="[object Object],[object Object"><p _ngcontent-serverapp-c4="">categories works!</p></app-categories><app-experience _ngcontent-serverapp-c1="" _nghost-serverapp-c5="" ng-reflect-experiences="[object Object],[object Object"><p _ngcontent-serverapp-c5="">experience works!</p></app-experience><app-stay _ngcontent-serverapp-c1="" _nghost-serverapp-c6="" ng-reflect-stays="[object Object],[object Object"><p _ngcontent-serverapp-c6="">stay works!</p></app-stay><app-spotlight _ngcontent-serverapp-c1="" _nghost-serverapp-c7="" ng-reflect-spotlights="[object Object],[object Object"><p _ngcontent-serverapp-c7="">spotlight works!</p></app-spotlight></div></app-main></app-root>

I followed the official angular universal documentation. What am I doing wrong here?

Answer 1

The issue is solved. The problem was with the URL which is used to fetch the data. This documentation helped me from that. Now the page is rendering completely.

Also please remember to add the httpClientModule in the app.module.ts file rather than adding to a NgModule.