2016-09-05 3 views
0

私はテーブルを表示するためにuiグリッドを使用しています。UIグリッド - ボタンが変更されていない列

最後の列には3つのボタンがあります。

フッター "Change Table"には、グリッドオプションをクリックすると、3つのボタンを表示する代わりに1つのボタンが表示され、 "Description"列は削除されます。

ボタンをクリックすると、[説明]列は削除されますが、ボタンの列は更新されません。

それはまだ3つのボタンの代わりに、1

Below is the jsFiddle link: 
    http://jsfiddle.net/ag3Lc1fz/ 

を見せてこれを行うには直接的な方法は

答えて

0

ありません助けてください。しかし、$ scope変数を使用すると、以下のようなボタンを隠して表示することができます。

$scope.oneColumn = false; 

    $scope.gridOptions = { 
     excludeProperties: '__metadata', 
     enablePaginationControls: false, 
     useExternalSorting: true, 
     useExternalFiltering: true, 
     enableFiltering: true, 
     onRegisterApi: function (gridApi) { 
      $scope.gridApi = gridApi; 

     } 
    }; 

    $scope.gridOptions.columnDefs = [ 
     { name: 'name', enableCellEdit: false, displayName: 'Name', width: '20%' }, 
     { name: 'type', displayName: 'Type', enableCellEdit: false, width: '20%' }, 
     { name: 'description', displayName: 'Description', width: '30%' }, 
       { name: 'id', displayName: '', width: '30%', cellTemplate: '<div class="ui-grid-cell-contents" title="TOOLTIP">' + 
         '<button class="material-icons noOutline" >1</button>' + 
         '<button data-ng-show="!grid.appScope.oneColumn" class="material-icons noOutline" >2</button>'+ 
         '<button data-ng-show="!grid.appScope.oneColumn" class="material-icons noOutline" >3</button>'+ 
         '</div>' } 
     ]; 

    $scope.toggleColumn = function() { 
     $scope.oneColumn = !$scope.oneColumn; 
    } 

http://jsfiddle.net/uvo9zoo0/2/を確認してください。

関連する問題