Question

我有一个角度应用程序，可以将json中的数据模板化为HTML表格。这里显示了一个项目。

http://plnkr.co/edit/EReUj4GkhGF36SS6RaX4?p=preview

<tr ng-repeat="item in data">
    <td><a href="{{ item.Name | removeSpacesThenLowercase }}">{{ item.Fields["{BB2389F3-555B-4FC6-B106-C0A23A55A15F}"].Value }}</a></td>
    <td>{{ item.Fields["{123A77C7-07D5-4CAA-85E0-8F9B9CEE110C}"].Value }}</td>
    <td>{{ item.Fields["{B588A80F-A8C0-4A97-A35A-07D81ED53E9B}"].Value | formatData}}</td>
</tr>

如果json中没有数据项，我想在表格单元格中显示一条消息：＆＃34;没有可用的数据＆＃34;。

这是一个没有数据的plunkr。有人可以帮我调整我的角度来渲染这条消息吗？

http://plnkr.co/edit/1B9aiNKAoEiyWwWiI7Mr?p=preview

<tr ng-repeat="item in data">
    <td colspan="3">No data available</td>
</tr>

Answer 1

使用ng-if="data.length==0"

<tr ng-if="data.length === 0">
    <td> No data available </td>
</tr>

这里是plunkr

Answer 2

您需要检查长度并显示相应的隐藏部分，请参阅此

<div ng-if="data.length == 0">
  <h3> No data found!</h3>
</div>

<div ng-if="data.length > 0">
  <table...>
     <tr>....header....</tr>
     <tr ng-repeat="item in data">
        .....
     </tr>
  </table>
</div>

Answer 3

在你的secound柱塞中，你的data.items数组中有一个空元素。如果json输出可能是一个空数组（如果有0个项目）那么它可以通过可靠的方式放在你的tr之后用ng-repeat指令，另一个用ng-show指令。像这样：

`<tr ng-repeat="item in data">
    <td>(...)</td>
    <td>(...)</td>
    <td>(...)</td>
 </tr>
 <tr ng-show="data.length=0">
      <td colspan="3">No data</td>
 </tr>'

你的掠夺者的叉子： http://plnkr.co/edit/UebdZXEf9UuOl0Dy3toA?p=preview

如果角度模型

3 个答案: