Events
The events you can listen to:
| Prop | When is it fired? |
|---|---|
| onOpen | On every open of the lightbox. |
| onClose | On every close of the lightbox. |
| onInit | On the initial open of the lightbox. |
| onShow | On every open of the lightbox excluding the initial open. |
| onSourceLoad | After every source's load. The source's element will be passed as the second argument, and its index as the third. |
onSlideChange
Pro
| On every change of the lightbox's slide. |
To listen to an event, set a desired function to the appropriate prop. The lightbox's instance will be passed as an argument.
import { Component } from "@angular/core";
import { FsLightbox } from "fslightbox-angular";
@Component({
selector: 'app-root',
imports: [FsLightbox],
template: `<div>
<fslightbox
[toggler]="toggler"
[sources]="sources"
[onSlideChange]="action"
/>
<button (click)="toggler=!toggler">
Open the lightbox
</button>
</div>`
})
export class App {
toggler = false;
sources = [
'/Images/1.jpg',
'/Images/2.jpg'
];
action(instance : any) {
console.log(instance)
}
}