[Fixed] Angular SVG Icon not work with Angular Universal project lazy loading module

Issue

Anguler: 11.2.5
typescript: 4.0.2
angular-svg-icon: 11.2.0

ERROR Error: Uncaught (in promise): NullInjectorError: R3InjectorError(AppHomeModule)[SvgIconRegistryService -> SvgIconRegistryService -> SvgLoader -> TransferState -> TransferState -> TransferState]: 
  NullInjectorError: No provider for TransferState!
NullInjectorError: R3InjectorError(AppHomeModule)[SvgIconRegistryService -> SvgIconRegistryService -> SvgLoader -> TransferState -> TransferState -> TransferState]: 

Component html:

    <svg-icon src="call.svg" [svgStyle]="{ 'width.px':90 }"></svg-icon>

lazy-loaded module call:

imports: [
   ...
    AngularSvgIconModule
  ],

app.module.ts

Solution

You need to import BrowserTransferStateModule on the client side (app.module.ts) and ServerTransferStateModule on the server side (app.server.module.ts)