Angular EasyUI 数据表格

属性列表

名称	数据类型	作用描述	默认值
idField	string	指示哪个字段是标识字段。	null
groupField	string	指示要分组的字段。	null
expanderWidth	number	展开列宽。	30

事件列表

名称	参数	作用描述
rowExpand	row:any	在展开行时触发。
rowCollapse	row:any	当行被折叠时触发。
groupExpand	value:any, rows:any[], collapsed:boolean	在展开组时触发。
groupCollapse	value:any, rows:any[], collapsed:boolean	在组折叠时触发。

字段列表

名称	类型	作用描述
groupTemplate	groupTemplate	一组模板。
detailTemplate	DetailTemplateDirective	详细模板。

方法列表

名称	参数	返回值	作用描述
sortData	none	void	对数据行进行排序。
collapseGroup	value:any	void	一组折叠。。
expandGroup	value:any	void	扩展一组。
toggleGroup	value:any	void	一组切换。
collapseRow	row:any	void	折叠一行。
expandRow	row:any	void	扩充一行。
toggleRow	row:any	void	连续切换。

注：
- 继承： GridBaseComponent 。
- 选择器： eui-datagrid 。

使用方法

<eui-datagrid [data]="data" style="height:250px">
    <eui-grid-column field="itemid" title="Item ID"></eui-grid-column>
    <eui-grid-column field="name" title="Name"></eui-grid-column>
    <eui-grid-column field="listprice" title="List Price" align="right"></eui-grid-column>
    <eui-grid-column field="unitcost" title="Unit Cost" align="right"></eui-grid-column>
    <eui-grid-column field="attr" title="Attribute" width="30%"></eui-grid-column>
    <eui-grid-column field="status" title="Status" align="center"></eui-grid-column>
</eui-datagrid>