javascript - 带有 ng-repeat 表的嵌套数组

Question

我有一个像这样的简单 json:

$scope.fruits = [
{
    "type": "fruit",
    "content": [
        {
            "name": "banana",
            "type": "edible"
        }
        {
            "name": "apple"
            "type": "edible"
        }
    ],
    "id": 1
},
{
    "type": "vegetable",
    "content": [
        {
            "name": "eggplant",
            "type": "edible"
        },
        {
            "name": "poison ivy",
            "type": "inedible"
        }
    ],
    "id": 2
}
]

我希望我的表格具有以下格式:

<tr>
    <td> fruit </td>
    <td> 1 </td>
    <td> banana </td>
    <td> edible </td>
</tr>
<tr>
    <td> fruit </td>
    <td> 1 </td>
    <td> apple </td>
    <td> edible </td>
</tr>
<tr>
    <td> vegetable </td>
    <td> 2 </td>
    <td> eggplant </td>
    <td> edible </td>
</tr>
<tr>
    <td> vegetable </td>
    <td> 2 </td>
    <td> poison ivy </td>
    <td> inedible </td>
</tr>

但是我似乎无法使用 ng-repeat 执行此操作，因为我无法嵌套循环，因此这样的操作不起作用:

<tr ng-repeat = "item in fruit in fruits">
    <td> {{fruit.type}} </td>
    <td> {{fruit.id}} </td>
    <td> {{item.name}} </td>
    <td> {{item.type}} </td>
</tr>

我应该以某种方式折叠我的 json 以便不存在嵌套数组吗？或者有没有办法让 Angular 来解析这个？我尝试过使用过滤器功能，但没有成功。如果有人可以帮助我了解如何实现预期结果或为我指明正确的方向，我将非常感激。

Answer 1

<span ng-repeat="category in fruits">
    <tr ng-repeat = "fruit in category.content">
        <td> {{category.type}} </td>
        <td> {{category.id}} </td>
        <td> {{fruit.name}} </td>
        <td> {{fruit.type}} </td>
    </tr>
</span>

或

你需要从当前对象重建一个新对象