如何打开每个元素的大图片?我现在有普通的div,其中每个元素在预览中都有图像。但是当我打开大视野时,我总是会从最后一个项目获得图像。
当我单击图像时,我的组件将始终打开最后一个图像(在此处为“死侍”)
我尝试过这种方式。寻找<p onClick="test()" class="container" gallerize>
<div *ngFor="let item of postsGroup; let i = index" [attr.data-index]="i" style="margin-top: 15px;" class="card col-md-8 p-0">
<div class="card-header">
<img src="https://www.w3schools.com/howto/img_avatar.png" alt="Avatar" class="avatar-post">
{{item.postTitle}}
</div>
<div class="card-body row">
<div class="col-md-12">
<p class="card-text">
{{item.postBody}}
</p>
<div *ngIf="item.photos.length > 0" class="row">
<p class="container" gallerize>
<img style="padding:1px; height: 70px; width: auto;" class="col-md-3"
*ngFor="let img of postPhotos[i]" [src]="img.srcUrl">
</p>
</div>
</div>
</div>
<div class="card-footer text-muted">
2 days ago
</div>
</div>
postPhotos中有来自typeCode的帖子照片
suc => {
this.postsGroup = suc;
console.log(suc);
for (let index = 0; index < this.postsGroup.length; index++) {
this.postPhotos.push(suc[index].photos);
}
},
我尝试过这种方式
<p onClick="test()" class="container" gallerize>
<img style="padding:1px; height: 70px; width: auto;" class="col-md-3"
*ngFor="let img of item.photos" [src]="img.srcUrl">
</p>
结果相同。大视图中的最后图像http://prntscr.com/pjsusb 有什么想法吗?