[英]How do you toggle show/hide in ng-template on Angular?
This is what I tried, and of course it makes visible all the items:这是我尝试过的,当然它使所有项目都可见:
<ng-template let-file let-i="index" pTemplate="file">
<div class="ui-fileupload-row">
<div><img [src]="file.objectURL" width="50"/></div>
<div>{{file.name}}</div>
<div>{{formatSize(file.size)}}</div>
<div><button (click)="toggleIsFormVisible()">Add metadata <i class="fa fa-plus"></i></button></div>
</div>
<div *ngIf="isFormVisible"></div>
</ng-template>
toggleIsFormVisible()
{
this.isFormVisible = !this.isFormVisible;
}
How do you do this knowing only the index, and without duplicating the items?你如何只知道索引而不复制项目?
this.isFormVisible
ngIf="IsFormVisible"
问题在于大写的i
字母。
Seems that solutions was not that complicated, inspired by msanford.似乎解决方案并没有那么复杂,灵感来自 msanford。
<ng-template let-file let-i="index" pTemplate="file">
<div class="ui-fileupload-row">
<div><img [src]="file.objectURL" width="50"/></div>
<div>{{file.name}}</div>
<div>{{formatSize(file.size)}}</div>
<div><button (click)="file.isFormVisible = !file.isFormVisible">Add metadata <i class="fa fa-plus"></i></button></div>
</div>
<div *ngIf="file.isFormVisible"></div>
</ng-template>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.