2017-02-28 6 views
1

나는 다음과 같은 그리드 옵션이있는 각도 UI 그리드를 가지고 : 나는 알았어 야AngularJS ui-grid 상단에 영구 빈 행을 제거하는 방법은 무엇입니까?

 $scope.gridOptions = { 
      data: 'gridData', 
      enableColumnMenus: false, 
      enableRowSelection: false, 
      enableFullRowSelection: false, 
      enableSelectAll: false, 
      enableRowHeaderSelection: false, 
      multiSelect: false, 
      noUnselect: false, 
      columnDefs: [ 
       { 
        field: 'FirstName', 
        name: 'First Name', 
        width: '*' 
       }, 
       { 
        field: 'LastName', 
        name: 'Last Name', 
        width: '*' 
       }, 
       { 
        field: 'RoleCode', 
        name: 'Role', 
        width: '*' 
       }, 
       { 
        field: 'Notes', 
        name: 'Notes', 
        width: '*' 
       }, 
       { 
        name:' ', 
        enableFiltering: false, 
        enableSorting: false, 
        enableColumnMenu: false, 
        width: '*', 
        cellTemplate:'<div>' + 
        '<a><button class="btn btn-primary btn-xs l-margin" ng-click="grid.appScope.onEditClick(row.entity)">Edit</button></a>' + 
        '<a><button class="btn btn-danger btn-xs l-margin" ng-click="grid.appScope.onDeleteClick(row.entity)">Delete</button></a>' + 
        '</div>' 
       } 
      ], 
      onRegisterApi: function(gridApi){ 
       $scope.$on('resize-grid',function() { 
        $timeout(function() { 
         gridApi.core.handleWindowResize(); 
        }); 
       }); 
      } 
     }; 

한 가지 내가 편집과 그리드의 상단에 빈 행을 받고 버튼을 삭제하고있어 것입니다. 그들이 세포 틀에 있기 때문에 이것이라고 생각합니다. 그리드 상단에 빈 행이 없도록하는 방법이 있습니까? 내가 모르는 그리드 옵션에 아마도 속성이 있습니까?

감사합니다.

+0

빈 데이터 행이 ui-grid에 나타나는 이유를 알고 있습니까? – CurlyShuffle

+0

아직도 도움이 필요하십니까? –

답변

0

몇 가지 코드/데이터/HTML/JS를 추가로 제공 할 수 있습니까? 모든

해피

var app = angular.module('app', ['ui.grid']); 
 
app.controller('MainCtrl', ['$scope', function($scope) { 
 
    $scope.gridOptions = { 
 
    data: 'gridData', 
 
    enableColumnMenus: false, 
 
    enableRowSelection: false, 
 
    enableFullRowSelection: false, 
 
    enableSelectAll: false, 
 
    enableRowHeaderSelection: false, 
 
    multiSelect: false, 
 
    noUnselect: false, 
 
    columnDefs: [{ 
 
     field: 'FirstName', 
 
     name: 'First Name', 
 
     width: '*' 
 
     }, 
 
     { 
 
     field: 'LastName', 
 
     name: 'Last Name', 
 
     width: '*' 
 
     }, 
 
     { 
 
     field: 'RoleCode', 
 
     name: 'Role', 
 
     width: '*' 
 
     }, 
 
     { 
 
     field: 'Notes', 
 
     name: 'Notes', 
 
     width: '*' 
 
     }, 
 
     { 
 
     name: ' ', 
 
     enableFiltering: false, 
 
     enableSorting: false, 
 
     enableColumnMenu: false, 
 
     width: '*', 
 
     cellTemplate: '<div>' + 
 
      '<a><button class="btn btn-primary btn-xs l-margin" ng-click="grid.appScope.onEditClick(row.entity)">Edit</button></a>' + 
 
      '<a><button class="btn btn-danger btn-xs l-margin" ng-click="grid.appScope.onDeleteClick(row.entity)">Delete</button></a>' + 
 
      '</div>' 
 
     } 
 
    ], 
 
    onRegisterApi: function(gridApi) { 
 
     $scope.$on('resize-grid', function() { 
 
     $timeout(function() { 
 
      gridApi.core.handleWindowResize(); 
 
     }); 
 
     }); 
 
    }, 
 
    data: [{"FirstName": "Matt", "LastName": "W", "RoleCode": "Stack Overflow User", "Notes": "Everything looks good."}, 
 
      {"FirstName": "Tim", "LastName": "Harker", "RoleCode": "Stack Overflow User", "Notes": "Everything looks good, again."}] 
 
    }; 
 
}]);
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.min.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-grid/4.0.2/ui-grid.min.js"></script> 
 
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/angular-ui-grid/4.0.2/ui-grid.min.css" /> 
 
<div ng-app="app" ng-controller="MainCtrl"> 
 
    <div ui-grid="gridOptions"></div> 
 
</div>

도와 ... 여기에 좋아 보인다.