Question

我有一个ui-grid，其数据是一个对象数组，为简单起见，我们称之为array1。 array1中的每个对象都有另一个对象数组array2。 ui-grid的一列是array2的长度。

如何通过实时计数使该列保持最新状态？

这就是我现在所拥有的：

$scope.array1 = [
    {id:0,array2:[{id:0,name:"foo"},{id:1,name:"bar"}], 
        count: $scope.array1[0].array2.length},
    {id:1,array2:[{id:0,name:"thing"}], 
        count: $scope.array1[1].array2.length},
]

$scope.uigrid.data = array1;

但是，如果我向array2数组添加新对象，则{uverrid中的array1.count不会更新，除非我像这样更改实际值：

$scope.addToArray2(array1,name){
    // logic to add another object to array2
    $scope.array1.count += 1;
}

有解决方法吗？

In order to illustrate this further, I made simplified version plunker, in which a member of an object keeps track of the count of objects.按“添加确定”，然后按“添加OKCount”，再添加几个OK，然后再按“添加OKCount”。您将看到对象中的值被冻结，并且未连接到实时数据。

Answer 1

定义数组而不显式定义计数：

$scope.array1 = [
{id:0,array2:[{id:0,name:"foo"},{id:1,name:"bar"}], 
{id:1,array2:[{id:0,name:"thing"}],
....
]

然后在ui-grid中使用.gridOptions声明样式：

$scope.gridOptions = {
};

$scope.gridOptions.columnDefs = [
  {name: 'id'},
  {name: 'array2'},
  {name: 'count', field: 'array2.length'}
]

$scope.gridOptions.data = $scope.array1;

HTML：

<div id="grid1" ui-grid="gridOptions" class="grid"></div>

复杂绑定的更多示例可以在http://ui-grid.info/docs/#/tutorial/106_binding的官方文档中找到。

如何跟踪对象内的变化？

1 个答案: