如何将* ngIf应用于返回表的数据?
我需要基于多条件* ngIf控制列名,但我不知道使用哪个标签以及在哪里:
*ngIf="coln=repcon.fieldName && repcon.columnType=1" then display data as icon link on field onlineurl
*ngIf="coln=repcon.fieldName && repcon.columnType=2" then make it as hidden field to field onlineurl
我在angular 7应用程序上工作,我显示的动态数据没有固定的标题或内容
<thead >
<tr>
<th *ngFor="let coln of headerCols">
{{coln}}
</th>
</tr>
</thead>
<tbody>
<ng-container *ngFor="let repcon of ReportControl">
<ng-container *ngFor="let repdata of ReportData">
<tr *ngFor="let rep of reportdetailslist">
<td *ngFor="let coln of headerCols">
<span>{{rep[coln]}}</span>
// i think here can applied multi ng if but which tag used .
</td>
</tr>
</ng-container>
</ng-container>
</tbody>
sample data
ReportId onlineurl reportdate
1222 localhost:5000/ 12-12-2018
1222 localhost:7000/ 12-01-2019
1222 localhost:9000/ 12-12-2020
control report
reportid fieldname columntype
1222 onlineurl 1
根据您的条件,您可以嵌套* ngIf:
<td *ngFor="let coln of headerCols">
<div *ngIf="coln=repcon.fieldName">
<div *ngIf="repcon.columnType=1">data as icon link</div>
<div *ngIf="repcon.columnType=2">hidden field</div>
</div>
</td>
或使用* ngSwitch:
<td *ngFor="let coln of headerCols">
<div *ngIf="coln=repcon.fieldName" [ngSwitch]="repcon.fieldName">
<div *ngSwitchCase="1">data as icon link</div>
<div *ngSwitchCase="2">hidden field</div>
</div>
</td>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句