MurhafSousli / ngx-gallery

Angular Gallery, Carousel and Lightbox
https://ngx-gallery.netlify.app/
MIT License
606 stars 128 forks source link

"autoPlay" not supported in SSR/Universal #572

Closed willdochnur closed 9 months ago

willdochnur commented 1 year ago

Page is not loading anymore when enabling "autoPlay". No logs available at all. It looks like Angular universal does not support setInterval without some more code:

My solution to get auto load to work for me:

import { isPlatformBrowser } from "@angular/common";
import { PLATFORM_ID } from "@angular/core";
...

@ViewChild("gallery") gallery?: GalleryComponent;

constructor(
    @Inject(PLATFORM_ID) private platformId: Object
  ) {}

ngAfterViewInit() {
    if (isPlatformBrowser(this.platformId)) {
      setInterval(() => this.gallery?.next(), 5000);
    }
  }

By the way: It would be nice if the auto play function would stop optionally if mouse is hovered over images.

What is the expected behavior?

Page should load and gallery should auto play.

What is the current behavior?

Page is not loading at all.

What are the steps to reproduce?

<gallery id="gallery" [items]="images" [autoPlay]="true"></gallery>

What is the use-case or motivation for changing an existing behavior?

Universal support is advertised.

Which versions are you using for the following packages?

Angular: 16.1.7 Angular CDK: 16.1.6 Typescript: 2.3.0 Gallery: 11.0.0