角6- jquery光盒

Question

我想将jquery：http://dbrekalo.github.io/simpleLightbox/添加到我的应用程序中，我的问题是，当我编写静态代码时，它运行良好，图像来自links = works，文件夹中的图像可以工作，但是当我编写*ngFor指令循环所有图像时，它返回我的错误，lightbox不是打开，而是在其他书签中打开。

错误：

Uncaught TypeError: Cannot read property 'addEventListener' of null
at window.onload (fotografia:29)

静态代码工作：

<div class="imageGallery1">
<a href="demo/images/4big.jpg" title="Caption for gallery item 1"><img src="demo/images/4small.jpg" alt="Gallery image 1" /></a>
<a href="demo/images/5big.jpg" title="Caption for gallery item 2"><img src="demo/images/5small.jpg" alt="Gallery image 2" /></a>
<a href="demo/images/6big.jpg" title="Caption for gallery item 3"><img src="demo/images/6small.jpg" alt="Gallery image 3" /></a>
</div>

动态不工作

component.html：

<div class="imageGallery1">
<a *ngFor="let image of galleryList; let i = index" [href]="image" title="Caption for gallery item {{i + 1}}"><img [src]="image" alt="Gallery image {{i + 1}}" /></a>

​

galleryList是一个字符串数组，有三个位置，有不同照片的链接

component.ts：

declare var $: any;
...
ngOnInit() {

$('.imageGallery1 a').simpleLightbox():

}
...

Answer 1

您可以使用具有角度的Ngx，而不需要jQuery:- https://github.com/themyth92/ngx-lightbox/tree/feature/upgradeAngular7。