UI 격자 - 단추가 변경되지 않는 열

Question

테이블을 표시하는 데 ui-grid를 사용하고 있습니다.

마지막 열에는 3 개의 버튼이 있습니다.

바닥 글 "변경 표"에 다른 버튼이있어서 격자 옵션을 클릭하면 변경되고 3 개의 버튼이 표시되는 대신 1 버튼이 표시되고 "설명"열이 제거되어야합니다.

사용자가 버튼을 클릭하면 "설명"열은 제거되지만 버튼 열은 새로 고쳐지지 않습니다.

아직

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

이

Answer 1

이 작업을 수행하는 직접적인 방법이 없습니다 도와주세요 대신 1의 3 개 버튼을 보여주는 것. 하지만 $ 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/.