From cc4099328fd2471cf226e0b0745597d2074153cf Mon Sep 17 00:00:00 2001 From: Nicholas Norris <41271531+salohcin714@users.noreply.github.com> Date: Mon, 23 Jan 2023 21:03:09 -0500 Subject: [PATCH 1/2] fix: add SSR support --- .../src/lib/animate-on-scroll.directive.ts | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/projects/ng2-animate-on-scroll/src/lib/animate-on-scroll.directive.ts b/projects/ng2-animate-on-scroll/src/lib/animate-on-scroll.directive.ts index 8d30d24..bc13f2f 100644 --- a/projects/ng2-animate-on-scroll/src/lib/animate-on-scroll.directive.ts +++ b/projects/ng2-animate-on-scroll/src/lib/animate-on-scroll.directive.ts @@ -5,10 +5,11 @@ import { ElementRef, OnInit, OnDestroy, - AfterViewInit, -} from "@angular/core"; + AfterViewInit, Inject, PLATFORM_ID, +} from '@angular/core'; import { ScrollService } from "./scroll.service"; import { Subscription } from "rxjs"; +import {isPlatformServer} from '@angular/common'; @Directive({ // eslint-disable-next-line @angular-eslint/directive-selector @@ -36,10 +37,15 @@ export class AnimateOnScrollDirective constructor( private elementRef: ElementRef, private renderer: Renderer2, - private scroll: ScrollService + private scroll: ScrollService, + @Inject(PLATFORM_ID) private platformId: any, + ) {} ngOnInit(): void { + if (isPlatformServer(this.platformId)) { + return; + } if (!this.animationName) { return; } From be84819ad0e73c26dc7aa3f220a834a082ebe222 Mon Sep 17 00:00:00 2001 From: Nicholas Norris <41271531+salohcin714@users.noreply.github.com> Date: Mon, 23 Jan 2023 21:07:20 -0500 Subject: [PATCH 2/2] fix: add SSR support 2 --- .../src/lib/animate-on-scroll.directive.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/projects/ng2-animate-on-scroll/src/lib/animate-on-scroll.directive.ts b/projects/ng2-animate-on-scroll/src/lib/animate-on-scroll.directive.ts index bc13f2f..ec68ab3 100644 --- a/projects/ng2-animate-on-scroll/src/lib/animate-on-scroll.directive.ts +++ b/projects/ng2-animate-on-scroll/src/lib/animate-on-scroll.directive.ts @@ -91,6 +91,9 @@ export class AnimateOnScrollDirective } ngAfterViewInit(): void { + if (isPlatformServer(this.platformId)) { + return; + } // run visibility check initially in case the element is already visible in viewport setTimeout(() => this.manageVisibility(), 1); }