正确显示ng模板消息

Question

我正在尝试使用ng-template来显示表是否不包含数据。我正在使用以下代码。它在这里工作，但我想在tbody tr的中间显示此消息。

<table class="table table-bordered">
            <thead>
                <tr>
                    <th colspan="5"></th>
                    <th colspan="5" style="text-align: center">%Penetration</th>
                    <th colspan="3"></th>
                </tr>
                <tr>
                    <th scope="col" *ngFor="let column of keyOrder">{{columns[column]}}</th>
                    <th scope="col">Action</th>
                </tr>
            </thead>
            <tbody *ngIf="productData else loading">
                <tr *ngFor="let productRow of productData">
                    <td *ngFor="let data of keyOrder">{{productRow[data]}}</td>
                    <td><a href="">Edit</a></td>
                </tr>
            </tbody>
        </table>


<ng-template #loading>
    <tr>
    <td>Data Not Available</td>
</tr>
</ng-template>