Configuration of item/thumb templates for lightbox

[christian-laakmann]

What is the expected behavior?

I would like to configure custom thumb- and item templates for lightboxes as well. When using gallerize on a gallery, the configured templates of the host component should be used to configure the lightbox as well (with options to provide separate templates for the lightbox, if required)

What is the current behavior?

Lightbox does not support configuring custom templates

What are the steps to reproduce?

What is the use-case or motivation for changing an existing behavior?

I would like to enable the zoom feature in the lightbox (described here: https://github.com/MurhafSousli/ngx-gallery/wiki/Image-zoom-example)

Which versions are you using for the following packages?

Angular: 10.x Angular CDK: 10.x Angular CLI: 10.x Typescript: 3.9 Gallery: 5.0

Is there anything else we should know?

[MurhafSousli]

You can already do that with the lightbox, but first you need to get a reference to the lightbox galleryRef and then you can set the thumbTemplate or itemTemplate

<ng-template #itemTemplate let-index="index" let-type="type" let-data="data" let-currIndex="currIndex">
  <ng-container *ngIf="type === 'imageViewer' && index === currIndex">

    <ngx-imageviewer [src]="data.src"></ngx-imageviewer>

  </ng-container>
</ng-template>

@ViewChild('itemTemplate') itemTemplate: TemplateRef<any>;

ngAfterViewInit() {
  this.gallery.ref('lightbox').setConfig({
    itemTemplate: this.itemTemplate
  })
}

I updated the image zoom example here https://stackblitz.com/edit/ngx-gallery-imageviewer?file=src%2Fapp%2Fhome%2Fhome.component.ts