Displaying content in Lightbox
LightBox component is used to display a collection of images, videos, inline HTML content, and also iframes in a modal Overlay mode. There are two types of LightBox modes that exist: one is the default image
type and the other one is the content
type. In the image mode, a collection of images will be displayed where each entry represents an image object which represent the source of the image, thumbnail, and title. A basic example of a LightBox with a collection (or array) of Angular conferences would be as follows:
<p-lightbox [images]="images" name="image"></p-lightbox>
The component will be rendered as shown in the following screenshot:

In the preceding snapshot, all the images are displayed as gallery of images and navigated through the next and previous icons.
Custom content mode
The content mode is enabled by setting the type
property to content
, which provides an anchor (or link) to open the LightBox and content to display inside of it. A customized...