ng2-carouselamos icon indicating copy to clipboard operation
ng2-carouselamos copied to clipboard

Bug when creating buttons inside the carousel and clicking on them

Open pantonis opened this issue 7 years ago • 3 comments

 <div ng2-carouselamos [width]="1300" [items]="productTypes" [$item]="itemTemplate" [$prev]="prevTemplate" [$next]="nextTemplate"></div>

                <ng-template #prevTemplate>
                    <span class="">
                            <i class="fa fa-arrow-left" aria-hidden="true"></i>
                        </span>
                </ng-template>

                <ng-template #nextTemplate>
                    <span class="">
                        <i class="fa fa-arrow-right" aria-hidden="true"></i>
                    </span>
                </ng-template>

                <ng-template let-item let-i="index" #itemTemplate>
                    <div class="btn-group" data-toggle="buttons">
                        <label class="btn margin-right-5" [ngClass]="(item.Selected === true) ? 'btn-selected' : 'btn-not-selected'" (click)="productTypesClicked(item)">                        
                            <input type="checkbox" class="toggle" [value]="item.Name">{{item.Name}}
                        </label>
                    </div>
                </ng-template>

in TS

export class CarouselItem {
    Name: string;
    Selected: boolean;

    constructor(name: string, selected: boolean) {
        this.Name = name;
        this.Selected = selected;
    }
}

    public assetTypeClicked(item: CarouselItem): void {
        item.Selected = !item.Selected;
        alert(item.Name);
    }

Try to click the first 2-3 items on the left then press the next button then try to click on buttons next to next button. Instead of the assetTypeClicked event to be fired the carousel scrolls left

pantonis avatar Sep 11 '17 13:09 pantonis

+1, did you find a way to fix this?

ch-hristov avatar Oct 14 '17 20:10 ch-hristov

no. dont have the time to check it :(

pantonis avatar Oct 14 '17 20:10 pantonis

This can be fixed by commenting the this.snap inside mouseUp function.

GusAV avatar Nov 14 '17 19:11 GusAV