我的html文件中包含以下代码:
<ag-grid-angular #agGrid
style="height: 300px"
[rowData]="rowData"
[columnDefs]="columnDefs"
[gridOptions]="gridOptions"
[enableFilter]="true"
(rowSelected)="getSelectedRows($event)">
</ag-grid-angular>
和过滤器图标可见,但是单击时没有任何反应,并且没有显示农业网格过滤器。 怎么了?
component.ts:
import { AgGridNg2 } from 'ag-grid-angular';
@ViewChild('agGrid') agGrid: AgGridNg2
columnDefs = [
{
headerName: 'row',
headerCheckboxSelection: true,
checkboxSelection: true,
pinned: "right",
width: 150
},
{ headerName: 'code', field: 'Code'},
{ headerName: 'name', field: 'Name' },
];
gridOptions = {
rowSelection: 'multiple',
enableSorting: 'true',
enableColResize: 'true',
enableRtl: 'true',
pagination: 'true',
paginationAutoPageSize: 'true',
animateRows: 'true'
}
答案 0 :(得分:1)
您正在将字符串“ true”分配给布尔值(true或false),并且ts代码应类似于:
import {Component} from "@angular/core";
import {GridOptions} from "ag-grid";
@Component({
selector: 'app-my-grid-application',
templateUrl: './my-grid-application.component.html'
})
export class MyGridApplicationComponent {
private gridOptions: GridOptions ;
constructor() {
this.gridOptions = <GridOptions>{
enableSorting: true,
enableFilter: true
};
this.gridOptions.columnDefs = [
{
headerName: 'row',
headerCheckboxSelection: true,
checkboxSelection: true,
pinned: "right",
width: 150,
field: 'row'
},
{
headerName: 'Code',
field: 'code'
},
{
headerName: 'Name',
field: 'name'
},
];
this.gridOptions.rowData = [
{row: 'test', code: 'test' , name:'test'}
]
}
getSelectedRows(e){
console.log('e')
}
}
答案 1 :(得分:0)
这里使用自定义过滤,
如果您的行未绑定值,则您使用自定义过滤。
{
headerName: "Date",
field: "date",
//Custom Filter Start
filterValueGetter: (params: ICellRendererParams) =>
{
if (this.transactionIsEmpty(params.data))
{
const tx: Transaction = params.data;
return moment(tx.date).format('DD-MM-YYYY');
}
},
//Custom Filter End
cellStyle: { 'text-align': 'left' },
minWidth: 250,
}