Jump to specific slide by clicking on custom button

[gbrlsnchs]

Jump to specific slide by clicking on custom button

[gbrlsnchs]

If I understand correctly, you want to navigate independently of the carousel's buttons. You could use the public API, more specifically slideTo.

[ruchirathakare]

My question is :

If I click on the button, it should slide up to the next.
How to manage it in component.ts file?
How should I use this slideTo Api inside it?

[ruchirathakare]

I tried using it by creating an instance.
constructor (public mc:MatCarouselComponent){} next(i){ this.mc.next(); // HelloComponent.html:25 ERROR TypeError: Cannot read property 'setNextItemActive' of undefined }

I am getting
slideTo(i) throwing this : HelloComponent.html:25 ERROR TypeError: Cannot read property 'setActiveItem' of undefined.

[gbrlsnchs]

You have to use a template reference variable with ViewChild to use the correct instance of the carousel. Then you can use the instance's methods, for example, slideTo.

[gbrlsnchs]

@ruchirathakare Did you solve your problem?

[shashank210292]

@gbrlsnchs how to use slideTo Api in our own component? Could you please provide steps