我愿意只使用 ngIf 显示特定元素;但是,出于某种原因,它不起作用。
问题:当我点击以仅显示特定元素时,所有其他元素都会显示出来!
代码:
HTML(元素来自异步请求)
<ion-col *ngFor="#finalFormat of elements">
<div *ngIf="currentElement">
<div>Show this element</div>
</div>
<div (click)="showThis(finalFormat.elementName)" *ngIf="!currentElement">CLICK TO SHOW</div></ion-col>
JS:
showThis(element){
if(this.currentElement === element){
return;
}
this.currentElement = element;
}
答案 0 :(得分:1)
我会像这样更新测试:
<div *ngIf="currentElement === finalFormat.elementName">
(...)
</div>
“点击显示”块相同:
<div (click)="showThis(finalFormat.elementName)"
*ngIf="!currentElement !== finalFormat.elementName">
CLICK TO SHOW
</div>
答案 1 :(得分:0)
我认为它可以更简单:
<ion-col *ngFor="#finalFormat of elements">
<div *ngIf="finalFormat.currentElement">
<div>Show this element</div>
</div>
<div (click)="showThis(finalFormat)" *ngIf="!finalElement.currentElement">CLICK TO SHOW</div>
</ion-col>
并在控制器中:
showThis(element) {
element.currentElement = !element.currentElement;
}
因此,您基本上只需修改单个currentElement
对象的finalFormat
属性。