### zhx.data.grid API
| props | type | description |
| --- | --- | --- |
| gridData | Object | grid組件數據對象 |
| scope | Object | grid所在控制器的作用域 |
| columnDefs | Array | grid列配置項 |
| checkModel | Boolean | 是否開啟多選功能 |
| sorter | Function | 如果表格有排序功能,則該Func表示排序后的回調方法 |
| flexHeight | Number | 該數值表示一個冗余高度,grid的高度由頁面高度減去此高度得到.設置該值后,grid會根據該值在頁面上自適應高度 |
| height | Number | grid的高度,設置該高度后,grid不會自適應高度 |
| paginationConf | Object | grid的翻頁配置項 |
___
### API description
> 以上API中有一些配置比較繁瑣或需要詳解的,這里列舉出詳細配置方法.
#### scope
***每一個控制器只允許定義一個grid組件且必須將當前控制器的作用于作為參數傳入grid組件***。其目的是為了保證grid的唯一性，因為grid會在當前控制的作用域下傳遞一些屬性和方法，以供控制器和grid組件進行交互操作。如果需要定義多個grid組件,那么可以配置多個控制器或者給grid創建一個新的作用域.
#### columnDefs
列對象是一組包含列對象的數組,我們約定了一些屬性名稱,這里會進行介紹:
| name | type | description |
| --- | --- | --- |
| name | String | 對應數據字段的名稱 |
| displayName | String | 展示在頁面中列的名稱 |
| width | Number | 設置一個列寬,如果不設置該屬性,則列會自動設置一個寬度 |
| enableSorting | Boolean | 該列是否可排序 |
| filter | String/Object | 該列配置的過濾器或者自定義過濾,filter的使用見下面詳解 |
| visible | Boolean | 配置該列初始化時是否自動隱藏 |
***注意,如果你希望在組件中增加序號列,你應該在此處新增已經約定好的一個列對象,如下:***
```js
{ displayName : "序號", name: "zhxRowNumber" }
```
在列屬性中,***filter***的使用完全依照AngularJS原生定義,可以傳入一個String表示已經配置的過濾器的名稱,其grid內部其實使用了AngularJS的`$filter`服務([具體可以參考官方文檔](https://docs.angularjs.org/api/ng/filter/filter)),這里舉兩個例子分別對應String的方式和Object的方式:
__String Model:__
```js
filter : 'formatDate' //formatDate為自定義過濾器
```
__Object Model:__
```js
filter : {
name : 'date', //過濾器的名稱
params : ['YYYY-MM-DD hh:mm:ss'] //過濾器接收的參數
}
```
#### flexHeight
就像上面提到的一樣，***flexHeight***屬性的目的是為了讓grid組件自適應高度，因為我們無法確定組件在什么條件與情況下使用，而又希望開發者能減少對前端的開發工作，所以當需要配置一個自適應高度的grid時就可以設置該屬性。
當配置該屬性后，grid的高度相當于 `gridHeight = clientHeight - flexHeight`;
#### sorter
排序屬性接收回調方法,該回調接收兩個參數,如下表:
| name | description |
| --- | --- |
| order | 排序字段 |
| desc | 升序or降序 |
故,在這里,你可以將grid排序后的參數傳遞給后臺查詢參數對象或者做點其他事情; 比如:
```js
//你的查詢參數
$scope.param = {
pageSize : 10,
pageNumber : 1,
orderBy : 'createTime',
descOrAsc : 'desc'
};
//grid配置參數
$scope.gridOptions = {
...
sorter : function(order,desc){
$scope.param.orderBy = order;
$scope.descOrAsc = desc;
}
...
}
```
以上是一個sorter的常見用法.
#### paginationConf
因為最初開發進度問題,grid并未開發一個翻頁組件與之配合,所以選擇了一個第三方翻頁組件進行了嵌套,這里的配置項就是該組件的配置項,配置項如下:
| name | type | description |
| --- | --- | --- |
| currentPage | Number | 當前頁號 |
| itemsPerPage | Number | 每頁多少條數據 |
| perPageOptions | Array | 可以選擇每頁展示多少條數據,一般情況可以配置為`[10,20,50,100]`; |
| onChange | Function | 在觸發翻頁,修改每頁多少條數據項等操作時執行該回調方法 |
