我想在ui网格中显示嵌套数据,例如data:
[
[
{ id:1, name:“test1 },
{ id:2, name:“test2 },
{ id:3, name:“test3 },
{ id:4, name:“test4 }
],
[
{ id:5, name:“test1 },
{ id:6, name:“test2 },
{ id:7, name:“test3 },
{ id:8, name:“test4 }
]
]
想法是用rowTemplate修复它,但是我不能在rowTemplate.html中获取数据以使用ng-repeat作为嵌套数据,我将在同一行显示多个数据,我不想使用ui网格分组。 我认为如果数据是嵌套数据,ui网格不处理数据,如果我将使用celltemplate row.entity为空并且为空,则相同。 例如rowTemplate.html
<div
ng-repeat="(colRenderIndex, col) in colContainer.renderedColumns track by col.uid"
ui-grid-one-bind-id-grid="rowRenderIndex + '-' + col.uid + '-cell'"
class="ui-grid-cell"
ng-class="{ 'ui-grid-row-header-cell': col.isRowHeader }"
role="{{col.isRowHeader ? 'rowheader' : 'gridcell'}}"
ui-grid-cell>
<!— Here i would like to use ng-repeat for the nested data but
row.entity , colRenderIndex, col each is empty if i use {{
row.entity col, ... }} result is empty blank —>
</div>
请帮助。
答案 0 :(得分:-1)
非常简单。您的所有数据都驻留在数组的第一个对象中。
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8" />
</head>
<body>
<div ng-app="app" ng-controller="ctrl">
<!--<div ng-repeat="(colRenderIndex, col) in colContainer.renderedColumns track by col.uid"
ui-grid-one-bind-id-grid="rowRenderIndex + '-' + col.uid + '-cell'"
class="ui-grid-cell"
ng-class="{ 'ui-grid-row-header-cell': col.isRowHeader }"
role="{{col.isRowHeader ? 'rowheader' : 'gridcell'}}"
ui-grid-cell>-->
<!— Here i would like to use ng-repeat for the nested data but
row.entity , colRenderIndex, col each is empty if i use {{
row.entity col, ...
}} result is empty blank —>
{{data}}
<table>
<thead>
<tr>
<td>ID</td>
<td>Name</td>
</tr>
</thead>
<tbody>
<tr ng-repeat="row in data[0]">
<td>{{row.id}}</td>
<td>{{row.name}}</td>
</tr>
</tbody>
</table>
<!--</div>-->
</div>
<script src="../lib/angular.js"></script>
<script>
var app = angular.module('app', []);
app.controller('ctrl', function ($scope) {
$scope.data=[
[
{ id:1, name:'test1' },
{ id:2, name:'test2' },
{ id:3, name:'test3' },
{ id:4, name:'test4' }
],
[
{ id:5, name:'test1' },
{ id:6, name:'test2' },
{ id:7, name:'test3'},
{ id:8, name:'test4' }
]
]
})
</script>
</body>
</html>