如何创建一个角度表行以折叠行

时间:2015-02-26 09:26:52

标签: json angularjs angularjs-ng-repeat

我有一个表,其中包含具有第二级信息的折叠行,但并非所有行都具有此第二级数据。

如果JSON脚本具有第二级,我如何编写控制器以仅显示第二级折叠行?

1 个答案:

答案 0 :(得分:0)

在控制器中定义了以下json:

$scope.cakes = [{ "id": "0001", "type": "donut", "name": "Cake", 
                "ppu": 0.55, "batters": "whatever", 
                "topping": [ { "id": "5001", "type": "None" }, 
                             { "id": "5002", "type": "Glazed" }, 
                             { "id": "5005", "type": "Sugar" }, 
                             { "id": "5007", "type": "Powdered Sugar" }, 
                             { "id": "5006", "type": "Chocolate with Sprinkles" }, 
                             { "id": "5003", "type": "Chocolate" }, 
                             { "id": "5004", "type": "Maple" } ] }, 
                { "id": "0002", "type": "cupcake", "name": "Cupcake", 
                                    "ppu": 0.60, "batters": "whatever", 
                                    "topping": [] },
                { "id": "0003", "type": "muffin", "name": "Muffin", 
                                    "ppu": 0.25, "batters": "whatever", 
                                    "topping": [] }
                ];

你可以选择性地在表格中显示第二行,其中cake.topping.length大于0:

<table>
    <tr ng-repeat-start="cake in cakes">
        <td>{{cake.type}}</td><td>{{cake.name}}</td>
    </tr>
    <tr ng-repeat-end ng-show="cake.topping.length>0">
        <td ng-repeat="t in cake.topping">{{t.type}}</td>
    </tr>
</table>