ng-Grid

https://github.com/angular-ui/ng-grid

https://github.com/angular-ui/ng-grid/wiki

Grid Options

id default value definition plunker

aggregateTemplate	<div ng-click="row.toggleExpand()" ng-style="{'left': row.offsetleft}" class="ngAggregate"><span class="ngAggregateText">{{row.label CUSTOM_FILTERS}} ({{row.totalChildren()}} {{AggItemsLabel}})</span><div class="{{row.aggClass()}}"></div></div>	Define an aggregate template to customize the rows when grouped. See github wiki for more details.	Link
afterSelectionChange	function (rowItem, event) {}	选择之后的回调函数	Link
beforeSelectionChange	function (rowItem, event) { return true; }	选择之前的回调函数，返回false，则取消选择，返回true，继续选择。如果你需要一个异步的回调，可以使用rowItem.continueSelection(event) 。注意：当使用shift多选时，仅仅触发一次，并且rowItem返回一个数组	Link
checkboxCellTemplate	<div class="ngSelectionCell"><input tabindex="-1" class="ngSelectionCheckbox" type="checkbox" ng-checked="row.selected" /></div>	Checkbox的模板	Link
checkboxHeaderTemplate	<input class="ngSelectionHeader" type="checkbox" ng-show="multiSelect" ng-model="allSelected" ng-change="toggleSelectAll(allSelected)"/>	Checkbox 的头模板	Link
columnDefs	undefined	列定义	Link
data	[]	数据源	Link
enableCellEdit	false	全局设置，是否允许CellEdit，可以使用editableCellTemplate覆盖。	Link
enableCellSelection	false	是否允许CellSelection	Link
enableColumnResize	false	是否允许ColumnResize	Link
enableColumnReordering	false	是否允许列重新排序	Link
enableHighlighting	false	Enable or disable cell content selection	Link
enablePaging	false	是否分页	Link
enableRowReordering	false	Enable drag and drop row reordering. Only works in HTML5 compliant browsers.	Link
enableRowSelection	true	To be able to have selectable rows in grid. (was canSelectRows prior to 2.0)	Link
enableSorting	true	是否允排序	Link
filterOptions	{ filterText: '', useExternalFilter: false }	filterText: 搜索框中绑定的内容. useExternalFilter: Bypass internal filtering if you want to roll your own filtering mechanism but want to use builtin search box.	Link
footerRowHeight	55	footer的像素	Link
groups	[]	分组，使用fieldName，并不是displayName	Link
groupsCollapsedByDefault	true	当分组的时候折叠	Link
headerRowHeight	32	header row 的像素	Link
headerRowTemplate	undefined	Define a header row template for further customization. See github wiki for more details.	Link
jqueryUIDraggable	false	Enables the use of jquery UI reaggable/droppable plugin. requires jqueryUI to work if enabled. Useful if you want drag + drop but your users insist on crappy browsers.	Link
jqueryUITheme	false	Enable the use jqueryUIThemes	Link
keepLastSelected	true	prevent unselections when ini single selection mode.	Link
maintainColumnRatios	undefined	在调整列宽时，重新调整大小，默认为true。Maintains the column widths while resizing. Defaults to true when using *'s or undefined widths. Can be ovverriden by setting to false.	Link
multiSelect	true	是否多选	Link
pagingOptions	{ pageSizes: [250, 500, 1000], pageSize: 250, totalServerItems: 0, currentPage: 1 }	pageSizes: list of available page sizes. pageSize: currently selected page size. totalServerItems: Total items are on the server. currentPage: the uhm... current page.	Link
plugins	[]	Array of plugin functions to register in ng-grid	Link
rowHeight	30	Row height of rows in grid.	Link
rowTemplate	<div ng-style="{ 'cursor': row.cursor }" ng-repeat="col in renderedColumns" ng-class="col.colIndex()" class="ngCell {{col.cellClass}}"><div class="ngVerticalBar" ng-style="{height: rowHeight}" ng-class="{ ngVerticalBarVisible: !$last }">&nbsp;</div><div ng-cell></div></div>	Define a row Template to customize output. See github wiki for more details.	Link
selectedItems	[]	选择的items，数组	Link
selectWithCheckboxOnly	false	Disable row selections by clicking on the row and only when the checkbox is clicked.	Link
showColumnMenu	false	是否显示菜单来选择显示和分组列，如果showColumnMenu和showFilter都为false，按钮不显示	Link
showFilter	false	是否在column menu中显示搜索框.，如果showColumnMenu和showFilter都为false，按钮不显示	Link
showFooter	false	是否显示footer	Link
showGroupPanel	false	是否显示分组拖拽区域	Link
sortInfo	{ fields: [], directions: [] }	定义一个默认的排序. You can also observe this variable to utilize server-side sorting (see useExternalSorting). Syntax is sortInfo: { fields: ['fieldName1',' fieldName2'], directions: ['asc', 'desc']}. Directions are case-insensitive	Link
showSelectionCheckbox	false	是否选择checkbox	Link
tabIndex	0	Set the tab index of the Vieport.	Link
useExternalSorting	false	Prevents the internal sorting from executing. The sortInfo object will be updated with the sorting information so you can handle sorting (see sortInfo)	Link
virtualizationThreshold	50	The threshold in rows at which to force row virtualization on.	Link
selectRow	function (rowIndex, state)	程序化的选择行	Link
selectItem	function (itemIndex, state)	程序化的选择行	Link

ColumnDefs Options

id default value definition plunker

aggLabelFilter	''	string name for filter to use on the aggregate label ('currency', 'date', etc..) defaults to cellFilter if not set.	Link
cellClass	''	Appends a css class for the column cells	Link
cellFilter	''	string name for filter to use on the cell ('currency', 'date', etc..)	Link
cellTemplate	<div class="ngCellText" ng-class="col.colIndex()"><span ng-cell-text>{{COL_FIELD CUSTOM_FILTERS}}</span></div>	Sets the cell template for the column. See github wiki for more details.	Link
displayName	field	Sets the pretty display name of the column. default is the field given	Link
editableCellTemplate	<input ng-class="'colt' + col.index" ng-input="COL_FIELD" />	Sets the editableCellTemplate for the column. Displayed when user uses enableFocusedCellEdit and cell is focused.	Link
enableCellEdit	false	Displays cellTemplate when user is not focused on cell. Displays editableCellTemplate when user focuses on cell.	Link
field	''	The string name of the property in your data model you want that column to represent. Can also be a property path on your data model. 'foo.bar.myField', 'Name.First', etc..	Link
groupable	true	Whether or not the user is allowed to group the column	Link
headerCellTemplate	<div class="ngHeaderSortColumn {{col.headerClass}}" ng-style="{'cursor': col.cursor}" ng-class="{ 'ngSorted': !noSortVisible }"><div ng-click="col.sort($event)" ng-class="'colt' + col.index" class="ngHeaderText">{{col.displayName}}</div><div class="ngSortButtonDown" ng-show="col.showSortButtonDown()"></div><div class="ngSortButtonUp" ng-show="col.showSortButtonUp()"></div><div class="ngSortPriority">{{col.sortPriority}}</div><div ng-class="{ ngPinnedIcon: col.pinned, ngUnPinnedIcon: !col.pinned }" ng-click="togglePin(col)" ng-show="col.pinnable"></div></div><div ng-show="col.resizable" class="ngHeaderGrip" ng-click="col.gripClick($event)" ng-mousedown="col.gripOnMouseDown($event)"></div>	Sets the template for the column header cell. See github wiki for more details.	Link
headerClass	''	Appends a css class for the column header.	Link
maxWidth	9000	Sets the maximum width of the column.	Link
minWidth	50	Sets the minimum width of the column.	Link
pinnable	true	Whether or not column can be pinned to the left.	Link
resizable	true	Whether or not column is resizable.	Link
sortable	true	Whether or not column is sortable.	Link
sortFn	Based on the detected data type	Sets the sort function for the column. Useful when you have data that is formatted in an unusal way or if you want to sort on an underlying data type. Check theMDN sort docs for examples	Link
visible	true	Whether or not the column is visible by default. Can be overridden by the user at run-time if showColumnMenu is true.	Link
width	'*'	Sets the width of the column. Can be a fixed width in pixels as an int (42), string px('42px'), percentage string ('42%'), weighted asterisks (width divided by total number of *'s is all column definition widths) See github wiki for more details.	Link

 

 

From： http://blog.csdn.net/violet_day/article/details/17448133