动态改变网格选项中的角ui.grid [英] Dynamically Change the Grid Options in angular ui.grid

问题描述

我必须表明两种gridOptions，而不必使用两格的努力来动态改变gridOptions不工作（一次工作）。

工作示例 http://plnkr.co/edit/4QKGIB?p=preVIEW 。

  $ scope.grid1 =功能（）{
   $ scope.gridOptions = $ scope.gridOptions1;
   $ scope.gridApi.core.notifyDataChange（uiGridConstants.dataChange.ALL）;
 }
 $ scope.grid2 =功能（）{
   $ scope.gridOptions = $ scope.gridOptions2;
   $ scope.gridApi.core.notifyDataChange（uiGridConstants.dataChange.ALL）;
 }
 

解决方案

基本上你需要使用 angular.copy（）同时分配columnDef电网，其中克隆数组并将其设置为 gridOptions 。

code

  $ scope.gridOptions = angular.copy（$ scope.gridOptions1）;
 $ http.get（'https://cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/data/500_complex.json'）
 .success（功能（数据）{
   $ scope.gridOptions1.data =数据;
   $ scope.gridOptions2.data =数据;
   $ scope.grid1（）;
 }）;
 $ scope.grid1 =功能（）{
   $ scope.gridOptions = angular.copy（$ scope.gridOptions1）;
   $ scope.gridApi.core.notifyDataChange（uiGridConstants.dataChange.ALL）;
 }
 $ scope.grid2 =功能（）{
   $ scope.gridOptions = angular.copy（$ scope.gridOptions2）;
   $ scope.gridApi.core.notifyDataChange（uiGridConstants.dataChange.ALL）;
 }
 

工作Plunkr

I have to show two types of gridOptions without using two grid's trying to change the gridOptions dynamically not working(one time working).

working example http://plnkr.co/edit/4QKGIB?p=preview.

$scope.grid1=function(){
   $scope.gridOptions = $scope.gridOptions1;
   $scope.gridApi.core.notifyDataChange(uiGridConstants.dataChange.ALL);
 }
 $scope.grid2=function(){
   $scope.gridOptions = $scope.gridOptions2;
   $scope.gridApi.core.notifyDataChange(uiGridConstants.dataChange.ALL);
 }

解决方案

Basically you need to use angular.copy() while assigning columnDef to grid, which clones the array and set it to the gridOptions.

Code

 $scope.gridOptions = angular.copy($scope.gridOptions1);
 $http.get('https://cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/data/500_complex.json')
 .success(function(data) {
   $scope.gridOptions1.data = data;
   $scope.gridOptions2.data = data;
   $scope.grid1();
 });
 $scope.grid1=function(){
   $scope.gridOptions = angular.copy($scope.gridOptions1);
   $scope.gridApi.core.notifyDataChange(uiGridConstants.dataChange.ALL);
 }
 $scope.grid2=function(){
   $scope.gridOptions = angular.copy($scope.gridOptions2);
   $scope.gridApi.core.notifyDataChange(uiGridConstants.dataChange.ALL);
 }

Working Plunkr

这篇关于动态改变网格选项中的角ui.grid的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！