SSR - Angular Universal - window is not defined

[Adrien LAMOTTE]

Hello !

I have an error when using your module with SSR :

ReferenceError: window is not defined at StickyThingDirective.getScrollTarget

Any way to fix this ?

Thank you !

[Deleted user]

Hello @adrienlamotte,

yes, you can fix it by checking the platform (server, browser) within your template.

In HTML

<ng-container *ngIf="isBrowser">
   <!-- In your case, stickyThing directive -->
   <div class="header" stickyThing="" [boundary]="boundary" [spacer]="spacer">
</ng-container>

In TS

isBrowser;
constructor(@Inject(PLATFORM_ID) private platformId) { 
   this.isBrowser = isPlatformBrowser(platformId);
}

THX @leo6104
@see here

Kind regards,

@tobiasatw11k

[Adrien LAMOTTE]

@tobiasatw11k thank you for your answer, but this is not really a solution.

SSR is mostly used for SEO, so with your workaround the content of my stickyThing (wich is a sidebar menu) will not be rendered by the server...

Thank you for youyr help :)

[Deleted user]

@adrienlamotte maybe this will work for you then:

<ng-container *ngIf="isBrowser; else seo_menu">
   <!-- sidebar with stickyThing directive for browsers (user)-->
   <sidebar-menu stickyThing=""></sidebar-menu>
</ng-container>
<ng-template #seo_menu>
    <!-- sidebar without stickyThing directive for servers (crawlers) -->
    <sidebar-menu></sidebar-menu>
</ng-tempalte>

[Adrien LAMOTTE]

Yes, that would work thank you.

But for further updates of you great module, you should try to handle that inside the directive directly :)

Thanks !