在lightbox中打开nxg-owl-carousel-o图片。

Question

我正在使用Angular 8版本的Owl Carousel（2.1.0），我想知道是否有一个选项可以点击滑块内的图片在灯箱中打开？我试了好几种方法，但都没有达到预期的效果......。如果不可能的话，谁能推荐一些其他的插件有这个功能？

<owl-carousel-o [options]="customOptions" class="slider">
    <!--*ngFor="let image of images"-->
    <ng-template carouselSlide>
        <img src="http://placekitten.com/500/300" alt="" class="slider-img" />
    </ng-template>
    <ng-template carouselSlide>
        <img src="http://placekitten.com/400/400" alt="" class="slider-img" />
    </ng-template>
    <ng-template carouselSlide>
        <img src="http://placekitten.com/400/300" alt="" class="slider-img" />
    </ng-template>
</owl-carousel-o>

ngOnInit() {
    this.customOptions = {
        loop: true,
        mouseDrag: true,
        touchDrag: true,
        pullDrag: true,
        autoHeight: true,
        dots: false,
        autoplay: true,
        autoplaySpeed: 300,
        autoplayHoverPause: true,
        navSpeed: 700,
        navText: ['', ''],
        responsive: {
            0: {
                items: 2
            },

            300: {
                items: 4
            }
        },
        nav: false
    };
}

编辑：通过绑定img标签上的点击事件解决了这个问题

<ng-template #element carouselSlide>
    <img src="http://placekitten.com/400/400" alt="" class="slider-img" (click)="openSomeLightboxDialog($event)" />
</ng-template>

Answer 1

编辑：通过绑定img标签上的点击事件解决了这个问题。

<ng-template #element carouselSlide>
    <img src="http://placekitten.com/400/400" alt="" class="slider-img" (click)="openSomeLightboxDialog($event)" />
</ng-template>