Click event on button not working inside ion-slide

well hello
I have a app where i have added a silder with button and on buttton i have wrritten (click) event
But problem is it is not getting triggered

Noticable thing is that click gesture (background changes when we click on button ) is there whenever i click on that button.

I have only one ion-slide in slides

html code

<ion-slides  autoplay="3500" loop="true" speed="3000">
<ion-slide *ngIf="img==''">
<div class="box">
<button ion-button icon-only (click)="profile()">
<ion-icon name="camera"></ion-icon>
<h6 no-padding no-margin >Upload Your Picture</h6>
<p no-padding no-margin class="margin12px">to get more matches</p>
<button ion-buttons></button>

<h5>Complete Your Profile</h5>
<button ion-button icon-end outline (click)="profile()">
Profile  <ion-icon name="person" ></ion-icon>


in ts file calling function


Can you please post a snippet of your code :slight_smile:

you didnt show any code, here is some working example:

<ion-slides *ngIf="gal== 1" pager="true" zoom="true" class="gal" initialSlide={{pic1}}>

<ion-slide *ngFor="let s of images">

<img src="{{s.pic_url}}" (click)="zoom(s.pic_url)">;


1 Like

Updated my question …
i getting this issue when my first condition is false so all i have only one slide in slides

Does it return any error on console?

May I know the value of img?

Thanks :blush:

i have backend for it from there i am getting value of img which could any img src and its string.

about errror thing as i mentioned the m click on it but nothing happens neither in console.

1 Like

same issue.
first time click event work for me. After that not working. html is below :

<ion-slides pager=“true” autoplay=“3000” loop=“true” *ngIf=“addBannerList?.length > 0”>
<ion-slide *ngFor=“let banner of addBannerList” (click)=“gotoLayerProfile(banner)”>

This is an Array of objects
addBannerList = [{image: “”, id: 637}]

Any Solution for this?

I made changes such as
In .ts file
import { Slides, Events } from ‘ionic-angular’;

@ViewChild(‘mySlider’) slides: Slides; //in class


ionViewDidEnter() {
this.slides.autoplayDisableOnInteraction = false;

In .html file
<ion-list *ngIf=“addBannerList?.length > 0”>
<ion-slides pager=“true” #mySlider id=“mySlider” autoplayDisableOnInteraction = “false” autoplay=“4000” loop=“addBannerList?.length > 1”>
<ion-slide tappable *ngFor=“let banner of addBannerList”>
<img src="{{banner.image}}" (click)=“gotoLayerProfile(banner)”>

Its works for me.
I hope its work for you