Using Siema's api with Angular's onclick

Question

I want to use Angular's onclick and inside use Siema's api to go the next slide. The problem is that I have no choice but to initialize the slider inside ngAfterViewInit. Anyway I can have access to the api outside of that function? I want to avoid querying a html selector and try to use a real angular click for this.

https://stackblitz.com/edit/angular-ctflzc

export class AppComponent  {
  name = 'Angular';

  siema = Siema;

  changeSlide() {
    this.siema.next();
  }

    ngAfterViewInit(): void {
    new Siema({
      loop: true
    });
  }
}

This is what I tried, but it does not seem to work.

Any help is appreciated!

Did you try to hold onto your reference of the `Siema` item you are new'ing up in your `ngAfterViewInit`? i.e. `this.siema = new Siema(...);` — Daniel W Strimpel, May 08 '19 at 01:01
wow that actually worked, can you post it as an answer, i'll give you the nod — Steven, May 08 '19 at 01:27

score 2 · Accepted Answer · answered May 08 '19 at 01:30

As mentioned in the comment, you just need to hold onto the reference of the carousel you are creating in your code:

export class AppComponent  {
  siema: Siema;

  changeSlide() {
    this.siema.next();
  }

  ngAfterViewInit(): void {
    this.siema = new Siema({
      loop: true
    });
  }
}

Using Siema's api with Angular's onclick

1 Answers1