ページングでUiGridデータが消える

Question

UiGridを使用して、エンドポイントで取得したデータを表示します。

paginatorsボタンをクリックすると、columnsDefsの名前を更新したいと思います。名前は正しく変更されますが、更新した列の行のデータは消えます

私は何が起こっているのか分かりません。何か案が？

ここにコードです。ここで

var app = angular.module('app', ['ngTouch', 'ui.grid', 'ui.grid.pagination']); 

    app.controller('MainCtrl', [ 
    '$scope', '$http', 'uiGridConstants', function($scope, $http, uiGridConstants) { 

     var paginationOptions = { 
     pageNumber: 1, 
     pageSize: 25, 
     sort: null 
     }; 

     var i = 0; 

     $scope.gridOptions = { 
     paginationPageSizes: [25, 50, 75], 
     paginationPageSize: 25, 
     useExternalPagination: true, 
     useExternalSorting: true, 
     columnDefs: [ 
      { name: 'name' }, 
      { name: 'gender', enableSorting: false }, 
      { name: 'company', enableSorting: false } 
     ], 
     onRegisterApi: function(gridApi) { 
      $scope.gridApi = gridApi; 
      $scope.gridApi.core.on.sortChanged($scope, function(grid, sortColumns) { 
      if (sortColumns.length == 0) { 
       paginationOptions.sort = null; 
      } else { 
       paginationOptions.sort = sortColumns[0].sort.direction; 
      } 
      getPage(); 
      }); 
      gridApi.pagination.on.paginationChanged($scope, function (newPage, pageSize) { 
      paginationOptions.pageNumber = newPage; 
      paginationOptions.pageSize = pageSize; 
      getPage(); 
      test(); 
      $scope.gridOptions.columnDefs[0].name="Test"+i; 
      gridApi.core.notifyDataChange(uiGridConstants.dataChange.ALL); 
      gridOptions.columnDefs.splice(0,gridOptions.columnDefs.length) 

      }); 
     } 
     }; 

     var test = function(){ 
     i++; 
     }; 

     var getPage = function() { 

     var url; 
     switch(paginationOptions.sort) { 
      case uiGridConstants.ASC: 
      url = 'https://cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/data/100_ASC.json'; 
      break; 
      case uiGridConstants.DESC: 
      url = 'https://cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/data/100_DESC.json'; 
      break; 
      default: 
      url = 'https://cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/data/100.json'; 
      break; 
     } 

     $http.get(url) 
     .success(function (data) { 
      $scope.gridOptions.totalItems = 100; 
      var firstRow = (paginationOptions.pageNumber - 1) * paginationOptions.pageSize; 
      $scope.gridOptions.data = data.slice(firstRow, firstRow + paginationOptions.pageSize); 
      $scope.gridApi.core.notifyDataChange(uiGridConstants.dataChange.ALL); 
     }); 
     }; 

     getPage(); 
    } 
    ]); 

はPlunker

感謝です！

Answer 1

名前を変更すると、レスキューにグリッド、displayNameのプロパティが混乱しています！

あなたがしなければならないすべてはこれに$scope.gridOptions.columnDefs[0].name="Test"+iを変更です：

$scope.gridOptions.columnDefs[0].displayName="Test"+i; 

の作業plunker：http://plnkr.co/edit/eMO6MYlPC1QzAFNirfLI?p=preview