Using MDB Lightbox with Angular2

  1. MDB Home Page
  2. Support Main Page
  3. Angular
Topic: Using MDB Lightbox with Angular2

Smustyle pro asked 4 years ago

Hi there, I'm creating an Angular 2 Webapp using MDB. I have some troubles including the MDB lightbox addon in a specific component. To test it I copied the whole code of the lightbox demo found on the mdbootstrap.com site and pasted it into the component html template. Afterwards I tried to load the mdb-lightbox-ui.html through the following jQuery code: $("#mdb-lightbox-ui").load("./../../assets/module/mdb-addons/mdb-lightbox-ui.html"); First I added this code snippet to the body of the index.html inside a javascript script-tag. Second I added it to the ngOnInit part of the component. Unfortunately it was no successful to init the mdb lightbox. I received no error in the console or something else. The pictures are displayed correctly, but when I click on the thumbnail to move to the lightbox-view, the picture is displayed like a normal picture in the browser. (No navigation, no mask,..) Can anyone help me to resolve this? Best Regards

Adrian Sawicki answered 4 years ago

Hello Smustyle, Unfortunately, we aren't currently supporting Angular 2. Regards

Smustyle pro answered 4 years ago

I guess it's not a problem of supporting Angular2, but the lightbox must be loaded on a specific place.

Adrian Sawicki answered 4 years ago

Hello Smustyle, I'm really sorry that you had to wait so long for the answer. Our lightbox won't work on angular2 and we don't have a fix for that yet. Currently, we started to work on angular2 version of MDB. We hope to finish it as soon as possible. Regards

Piotr Bender answered 4 years ago

Hello, In response to your issue, I wanted to let you know about just released MDBootstrap Angular kit, that may be a sufficient solution to this or any other issues you have had with Angular integration so far. The kit can be found at the following link: https://mdbootstrap.com/angular/ It contains all the components you could find in MDB jQuery version. We encourage you to try it out and report any bugs or issues at support@mdbootstrap.com with [Angular] prefix or create a thread on this forum. Have a great day!

Sebopede pro premium commented 11 months ago

This is a follow up comment from Smustyle, the lightbox works but without any zoom transitions or swipe compatability.
Write
Create snippet
Please insert min. 20 characters.
Status

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: Angular
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags
angular2 lightbox
Related topics
1
lightbox gallery customization
1
Images within lightbox functions can not work well
1
Lightbox not switching from thumbnail to full scale image
0
Building with Webpack MDB Files (Not working)
0
MDB Lightbox is not working on elements loaded with ajax
About author
Smustyle
Pro User
10Support score
1Questions 1Answers
0Snippets likes 0Snippets

We use cookies to offer you a better browsing experience, analyze site traffic, personalize content, and serve targeted advertisements. Read about how we use cookies and how you can control them by clicking "Cookie Settings." If you continue to use this site, you consent to our use of cookies.