Question

如果没有数据，我正在寻找一个如何不显示我的表的解决方案。我试过<div class="row row1"> <div class="row-item item1">1</div> <div class="row-item item2"> <div> 2.1 </div> <div> 2.2 </div> </div> <div class="row-item item3">3</div> </div> <div class="row row2"> <div class="row-item item1">1</div> <div class="row-item item2"> <div> 2.1 </div> <div> 2.2 </div> </div> <div class="row-item item3">3</div> </div>，但它不起作用，也许我做错了。

我认为*ngIf不是一个好的解决方案。

这是我的代码：

[hidden]

Answer 1

您可以使用*ngIf

<table *ngIf="exceptions" class="table table-hover table-condensed">
    <th>Date</th>
    <th>Timeslot</th>

    <tr *ngFor="let exception of exceptions">
        <td>{{exception.date}}</td>
        <td>{{exception.value}}</td>
    </tr>
</table>

Answer 2

<div *ngIf="exceptions.length > 0">
    <h1 class="applicationTitle">Exceptions</h1>

    <table class="table table-hover table-condensed">
        <th>Date</th>
        <th>Timeslot</th>

        <tr *ngFor="#exception of exceptions">
            <td>{{exception.date}}</td>
            <td>{{exception.value}}</td>
        </tr>
    </table>
</div>

您只需要更新If条件即可。

Answer 3

<table class="table table-hover table-condensed" *ngIf="exceptions.length > 0">

请记住ngIf将从DOM中删除该元素，如果您的表格非常大，这可能是一项昂贵的操作。在这种情况下，您最好使用[hidden]。

如果在Angular2中它是空的，如何不显示表格

3 个答案: