import { Component, OnInit, ViewChild, Input } from '@angular/core'; import { AgGridAngular } from 'ag-grid-angular'; import { ColDef } from 'ag-grid-community'; import { GridApi, } from 'ag-grid-community'; import { NzPaginationModule } from 'ng-zorro-antd/pagination'; @Component({ selector: 'app-ag-grid-component', imports: [AgGridAngular, NzPaginationModule], standalone: true, templateUrl: './ag-grid-component.component.html', styleUrls: ["./pagination-style/pagination.less"] }) export class AgGridComponentComponent implements OnInit { @ViewChild('myGrid') grid!: AgGridAngular; /**每页数 */ public pageSize!: number; /**当前页 */ public pageIndex!: number; /**总数 */ public pageRowTotal!: number; //默认列配置 @Input() defaultColDef: ColDef = { width: 130, editable: false, }; /** 列头 */ @Input() columnDefs: ColDef[] = []; /**行数据 */ @Input() rowData: any[] = []; /**表格主题 */ @Input() gridThemeClass: string = "ag-theme-quartz" @Input() paginationThemeClass: string = "ag-theme-quartz" /** 构造函数 */ constructor() { } /**初始化 */ ngOnInit() { console.log('-----表格初始化-----'); this.pageSize = 10; this.pageIndex = 1; this.pageRowTotal = this.rowData.length; } //每页数 nzPageSizeChange(_pageSize: any) { this.pageSize = _pageSize; } //当前页 nzPageIndexChange(_pageIndex: any) { console.log("nzPageIndexChange" + _pageIndex) if (this.grid.api) { if (_pageIndex == 1) { /**去首页 */ this.grid.api.paginationGoToFirstPage(); } else { /** 页面跳转 */ this.grid.api.paginationGoToPage(_pageIndex); } } } }