Question

我需要显示json中的列名。但是问题是所有列名都显示在1列中。由于某种原因，添加了空字段。以及如何推断出列名的行？

<table class="table table-hover">
  <thead >
    <tr *ngFor="let attribute of attributes" >
      <ng-container *ngIf="(attribute.is_visible) == true">
        <th style="text-align: center;" ><b>{{attribute.name }}</b></th>
      </ng-container>
    </tr>
 </thead>
 ...

Answer 1

做这样的事情=>

<table class="table table-hover">
  <tr> 
     <th *ngFor="let attribute of attributes" style="text-align: center;" >
     <ng-container *ngIf="(attribute.is_visible) == true">
     <b>{{attribute.name }}</b>
     </ng-container>
     </th>  
  </tr>

在您的情况下，您正在<tr>中循环遍历，这将导致为每次迭代构建一个新行。而是在<th>

内部进行

Answer 2

尝试一下

<table class="table table-hover">
  <thead>
    <tr >
      <ng-container *ngFor="let attribute of attributes">
        <th *ngIf="(attribute.is_visible) == true" style="text-align: center;" ><b>{{attribute.name }}</b></th>
      </ng-container>
    </tr>
 </thead>

Answer 3

您可以尝试使用此解决方案

在*ngFor标记中使用th。

我已经在Stackblitz上创建了一个演示

<table class="table table-hover">
    <thead>
        <tr>
            <th *ngFor="let attribute of attributes" style="text-align: center;">
                <ng-container *ngIf="(attribute.is_visible) == true">
                    <b>{{attribute.name }}</b>
                </ng-container>
            </th>
        </tr>
</thead>

如何以字符串显示信息？

3 个答案: