Javascript 如何将多ngif应用于表格上的数据显示?

Javascript 如何将多ngif应用于表格上的数据显示?,javascript,typescript,angularjs-directive,angular7,angular-components,Javascript,Typescript,Angularjs Directive,Angular7,Angular Components,如何对返回到表中的数据应用multi*ngIf 我需要根据multi-condition*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

如何对返回到表中的数据应用multi*ngIf

我需要根据multi-condition*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

{{coln}}
{{rep[coln]}
//我认为这里可以应用多ng if,但使用哪个标签。
样本数据
ReportId onlineurl reportdate
1222本地主机:5000/12-12-2018
1222本地主机:7000/12-01-2019
1222本地主机:9000/12-12-2020
控制报告
reportid字段名列类型
1222在线URL 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>

数据作为图标链接
隐藏字段

根据您的条件,您可以嵌套*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>

数据作为图标链接
隐藏字段

你可以有多个
div
标签有*ngIf。你可以有多个
div
标签有*ngIf。好的,谢谢你回复如何将数据显示为图标链接我不知道,你的问题是“如何应用多ngIf?”,所以我回答了。“将数据显示为图标链接”是什么意思?什么是“图标链接”?图标链接意味着将文本URL显示为带有快照名称URL链接的链接什么,你指的是像
这样的简单链接?好的,谢谢你回答如何将数据显示为图标链接我不知道,你的问题是“如何应用多ngif?”,所以我回答了。“将数据显示为图标链接”是什么意思?什么是“图标链接”?图标链接意味着将文本URL显示为带有快照名称URL链接的链接什么,你是指像
这样的简单链接?