如何在ng-grid中显示嵌套的JSON数据？

Question

我有一个JSON数据

{
    "data1": "val1",
    "data2": val2,
    "data3": [{
      "data4": "val3",
      "data5": "val4"
    }, {
      "data6": "val5",
      "data7": "val6"
    }],
    "data8": [{
      "data9": "val7",
      "data10": "val8",
      "data11": "val9"
    }, {
      "data12": "val10",
      "data14": "val11",
      "data14": "val12"
    }, {
      "data15": "val13",
      "data16": "val14",
      "data17": "val15"
    }],
    "id": 1
}

我想将内部JSON保留为一个单元格中的多个选择复选框或多个选择下拉列表。

为例如：用于data3柱单个小区将具有多个选择的复选框或与值的多个选择下拉data4和data6 1组和在另一组data5和data7 。

我如何在这里表示数据？ 任何更好的解决方案也表示赞赏。

Answer 1

这是我如何做同样的例子。 gridOptions填充在控制器中。 在这种情况下，我使用http://ui-grid.info/

请注意，由于代码丑陋，因此必须对其进行重构，但是它可以正常工作。

vm.gridOptions =
            {
                columnDefs: [
                    { name: 'id', field: 'id' },
                    { name: 'name', field: 'name' },
                    { name: 'route', field: 'route' },
                    { name: 'sysmodulescreen name', field: 'sysModuleId' },
                    {
                        name: 'enable/disable',
                        field: 'isEnabled',
                        cellTemplate: '<button ' +
                            'ng-if="row.entity.isEnabled == 1" ' +
                            'class="btn btn-danger" ' +
                            'ng-model="row.entity.id" ' +
                            'ng-click="grid.appScope.disableModuleScreen(row.entity.id)">Disable</button>' +
                            '<button ' +
                            'ng-if="row.entity.isEnabled == 0" ' +
                            'class="btn btn-success" ' +
                            'ng-model="row.entity.id" ' +
                            'ng-click="grid.appScope.enableModuleScreen(row.entity.id)">Enable&nbsp;</button>'
                    },
                    {
                        name: 'edit',
                        field: 'id',
                        cellTemplate: '<button class="btn" ng-model="row.entity.id" ng-click="grid.appScope.editModuleScreen(row.entity.id)">Edit</button>'
                    },
                    {
                        name: 'delete',
                        field: 'id',
                        cellTemplate: '<button class="btn" ng-model="row.entity.id" ng-click="grid.appScope.deleteModuleScreen(row.entity.id)">Delete</button>'
                    }
                ]
            };