数据从服务器到达后,Angular ui-grid不会更新视图

时间:2015-06-26 15:10:48

标签: javascript angularjs angular-ui-grid

也许以前曾问过这个问题,但我尝试了其他帖子中看到的解决方案,例如禁用快速监视,但似乎没有任何工作......

我的网页中有一个使用Angular ui-grid的网格,我想要的是在点击按钮后必须更新数据。问题是我可以看到gridOptions.data已更新,columnDefs也是,甚至长度但视图不更新,显示也变得有点乱,我必须滚动才能正确。

这是我的代码

控制器:

(function(app) {



'use strict';



app.controller('Ctrl', Ctrl);



function Ctrl($scope, $routeSegment, $log, $filter) {

$log.debug('Controller - init()');

// Set ViewModel Object - will be exported in View
var viewModel = this;


viewModel.gridOptionsData = [];
viewModel.gridOptions = {};
viewModel.gridOptions.paginationPageSizes = [25, 50, 75];
viewModel.gridOptions.paginationPageSize = 25;
viewModel.gridOptions.data = [];
viewModel.gridOptions.rowIdentity = function(row) {
  return row.id;
};
viewModel.gridOptions.getRowIdentity = function(row) {
  return row.id;
};


$scope.showgrid = false;
$scope.filterText;

viewModel.refreshData = function() {
  viewModel.gridOptions.data = $filter('filter')(viewModel.gridOptionsData, $scope.filterText, undefined);
};

$scope.$watch('dataStructure', function(data) {
  if (angular.isDefined(data) && !angular.equals(data, [])) {
    var struct = [];
    for (var key in data[0]) {
      if (angular.equals(key, 'id')) {
        struct.push({
          field: key, 
          visible : false
        });
      } else {
        struct.push({
          field: key, 
        });
      }
    }
    viewModel.gridOptionsData = data;
    viewModel.gridOptions.data = data;
    viewModel.gridOptions.columnDefs = struct;
    $scope.showgrid = true;
  }
});
  }

}(angular.module('app')));

查看:

<div class="gridStyle" ui-grid="pageViewModel.gridOptions" ui-grid-pagination ></div>
              <input type="text" ng-model="$parent.filterText" ng-change="pageViewModel.refreshData()" placeholder="Search / Filter" />

感谢您的帮助

0 个答案:

没有答案