问题描述
我在我的项目中使用了crystalui灯箱,因为我已经实现了演示的正常工作,但是当我尝试使用动态数据来实现它时,显示问题出了,因为文档显示了这种灯箱的语法
<img src="assets/images/pic1.jpg" [fullImage]="{path: 'assets/images/pic1.jpg'}" > but when i tried to add dynamic data in the loop its not working because of wrong syntex
[fullImage]="{path: 'assets/images/gallery/portrait-2/{{item.image}}'}"
请告诉我如何使用动态图片路径{{item.image}},下面是模块站点链接
https://www.npmjs.com/package/@crystalui/angular-lightbox
谢谢
解决方法
您不能像这样使用Angular绑定。我会给你一个例子,说明我的用法。
<img class="img-fluid" id="user-image"
[src]="mediaService.getRenderedImg()"
alt="Sample image"
lightbox
backgroundColor="black"
backgroundOpacity="0.9"
closeButtonText="Close"
[simpleMode]="true"
[fullImage]="{path: mediaService.getRenderedImg()}"
>
根据您的情况,您应该将代码更改为:
[fullImage]="{path: 'assets/images/gallery/portrait-2/' + item.image'}"