|                                                                 | 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465 | 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);
      }
    }
  }
}
 |