angular-ui-grid - angular ui-grid の列の可視性を変更する

Question

グリッドがレンダリングされた後に列を表示/非表示にしたい。新しい ui-grid に移動する前に呼び出しましtoggleVisible()たが、今は機能していないようです。次のように列定義の可視性（またはその他のプロパティ）を変更しようとしました

columnDefs[9].visible = false;

列定義 (レンダリング前) で可視性を設定すると機能しますが、病棟後に変更することはできません。

Answer 1

古い質問ですが、これは 3.0.0-rc.20 で機能します。columnDefs がスコープ内にある必要があると思います。

$scope.columnDefs = [ 
    { name: 'one' },
    { name: 'two', visible: false }
];

$scope.grid = {
    data: 'data',
    columnDefs: $scope.columnDefs
};

$scope.grid.onRegisterApi = function(gridApi){
    $scope.gridApi = gridApi;
};    

$scope.showColumnTwo = function() {
    $scope.columnDefs[1].visible = true;
    $scope.gridApi.grid.refresh();
};

Answer 2

作業を開始したばかりangular-ui-gridなので、これは最善の解決策ではない可能性があります。

uiGrid api オブジェクトを含めてから、オブジェクトでrefershメソッドを呼び出してみてくださいgrid

...
$scope.gridOptions.onRegisterApi = function(gridApi){
  $scope.gridApi = gridApi;
};
....
columnDefs[9].visible = false;
$scope.gridApi.grid.refresh();

Answer 3

columndDef を作成する必要のないソリューションを誰かが探していた場合。

 s.gridOptions = {
    data: 'myData',
    onRegisterApi: function(gridApi) {
      gridApi.core.registerColumnsProcessor(hideIdColumn);
      s.gridApi = gridApi;

      function hideIdColumn(columns){
          columns.forEach(function(column){
            if(column.field==='_id'){
              column.visible=false;
            }
          });
          return columns;
      }

    }

column.field==='_id' の部分を独自の条件に置き換えるだけです。また、列を返すことを忘れないでください。そうしないと、列がまったく取得されません。