Question

因此，如果数据可用，我会让此表显示绿色圆圈。在gegevensAanwezig中，您有一个学校名称和一些布尔（Entreetoets，Eindtoets等），以显示数据是否可用。

        <tr *ngFor="let g of gegegevensAanwezig">
            <td>{{ g.brinCode }}</td>
            <td>{{ g.schoolNaam }}</td>
            <td></td>
            <td></td>
            <td><div class="circle" [hidden]="!g.Entreetoets">  </div> </td>
            <td><div class="circle" [hidden]="!g.Eindtoets">  </div></td>
            <td><div class="circle" [hidden]="!g.BLez">  </div></td>
            <td><div class="circle" [hidden]="!g.BLui">  </div></td>
            <td><div class="circle" [hidden]="!g.DMT">  </div></td>
            <td><div class="circle" [hidden]="!g.ORD">  </div></td>
            <td><div class="circle" [hidden]="!g.RW">  </div></td>
            <td><div class="circle" [hidden]="!g.SP">  </div></td>
            <td><div class="circle" [hidden]="!g.SV">  </div></td>
            <td><div class="circle" [hidden]="!g.TL">  </div></td>
            <td><div class="circle" [hidden]="!g.TV">  </div></td>
            <td><div class="circle" [hidden]="!g.TVK">  </div></td>
            <td><div class="circle" [hidden]="!g.WS">  </div></td>
        </tr>

g.brinCode＆amp; g.schoolNaam正在工作，他们显示学校名称和学校代码就好了。但[hidden]或*NgIf无效。显示所有圆圈或显示任何内容。

这是因为Angular-universal在浏览器提供数据后加载数据时在后端呈现视图吗？

我在提供视图后使用if (isBrowser)加载数据，因为我需要localStorage。

截图：如果布尔值为真或假，则应使用一些绿色圆圈填充空白区域

console.log(gegevensAanwezig)：

Answer 1

事实证明，角度不会识别资本变量.. 我将所有内容都更改为小写并且有效..

Answer 2

只需检查

<div *ngIf = "gegegevensAanwezig">
   //then procced with the ngFor
</div

在评论后更新

尝试将其添加到样式表中，同时检查隐藏属性是否附加到dom中的元素。

[hidden] {
  display: none;
}

Angular 2：[隐藏]和* NgIf不工作？

2 个答案: