Angular JS:仅当ng-repeat有成员时显示项目?

时间:2015-03-21 21:58:41

标签: javascript angularjs angularjs-ng-repeat

我有json数据,其中一系列对象有一个数组“选项”。有些项目在此数组中有项目,有些项目没有,如

{
  "label": "ORDERS",
  "enabled": true,
  "selected": true,
  "options": [
    {
      "label": "Edit addresses",
      "value": true
    },
    {
      "label": "Cancel orders",
      "value": true
    },
    {
      "label": "Uncancel orders",
      "value": false
    }
  ]
},
{
  "label": "FOO",
  "enabled": true,
  "selected": false,
  "options": [

  ]
},

如您所见,ORDERS有选项,但FOO没有。

这会产生如下布局:

enter image description here

我有转发器数据之外的项目,允许标题和复选框。

我只想在options数组有项目时显示那些。这是我解释的方式:http://plnkr.co/edit/QLY9311r4nSCRUolKvLs?p=preview

我无法弄清楚如何在没有选项数组的行上使用“允许”标题和复选框隐藏行:

enter image description here

1 个答案:

答案 0 :(得分:0)

这会有用吗?

    <tr ng-if="t.options.length">
      <td colspan="2"></td>
      <td align="center">Allowed</td>
    </tr>
    <tr ng-if="t.options.length">
      <td colspan="2"></td>
      <td align="center">
        <input type="checkbox" name="" id="" />
      </td>
    </tr>
    <tr ng-repeat="o in t.options">
      <td></td>
      <td>{{o.label}}</td>
      <td align="center">
        <input type="checkbox" ng-model="o.selected" />
      </td>
    </tr>