如何刪除AngularJS ui-grid頂部的持久空行？

我有一個角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(); 
        }); 
       }); 
      } 
     };

的一件事是我在與編輯網格的頂部得到一個空行和刪除按鈕。我想這是因爲他們在單元格模板中。有沒有辦法沒有在網格頂部的空白行？有沒有我沒有意識到的網格選項中的屬性？

謝謝

來源

2017-02-28 CurlyShuffle

有誰知道爲什麼一個空的數據行會出現在用戶界面上？ – CurlyShuffle

你還需要幫助嗎？ –

你能否提供更多的代碼/數據/ 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>

很高興能幫助你。

來源

2017-03-11 03:25:44

如何刪除AngularJS ui-grid頂部的持久空行？

回答

相關問題