我的 ngFor 有问题:对于列表中的每个项目,我都有一个图像,通过单击我想仅显示该图像的详细信息。问题是,如果我单击图像,列表中所有项目的详细信息都会显示出来。
.html:
<div class=" gif" *ngFor="let r of result">
<img [src]="r.images.downsized.url" alt="image" (click)="getDetails()">
<div class="v3" *ngIf="this.clicked">
<ion-list>
<ion-item>
<ion-label>
<h2>username: {{r?.username}}</h2>
<h3>title: {{r?.title}}</h3>
<p>import date:{{r?.import_datetime}}</p>
</ion-label>
</ion-item>
</ion-list>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
.ts:
ngOnInit() {
this.clicked = false
}
getDetails(): void {
if (!this.clicked) {
this.clicked = true
}
else {
this.clicked = false
}
}
Run Code Online (Sandbox Code Playgroud)