Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

"autoPlay" not supported in SSR/Universal #572

Closed
willdochnur opened this issue Aug 10, 2023 · 0 comments · Fixed by #583
Closed

"autoPlay" not supported in SSR/Universal #572

willdochnur opened this issue Aug 10, 2023 · 0 comments · Fixed by #583

Comments

@willdochnur
Copy link

willdochnur commented Aug 10, 2023

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

@MurhafSousli MurhafSousli linked a pull request Dec 22, 2023 that will close this issue
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant