在使用Ag Grid时，可以通过定义自定义的头部渲染器来替代默认的头部渲染器。下面是一个使用Angular的代码示例：

1. 创建一个自定义的头部渲染器组件 custom-header-renderer.component.ts：

import { Component } from '@angular/core';
import { IHeaderAngularComp } from 'ag-grid-angular';

@Component({
  selector: 'app-custom-header-renderer',
  template: `
    

      
{{ params.displayName }}
      

        
        
      
    
  `,
  styles: [
    `
      .custom-header {
        font-weight: bold;
      }
      .custom-header-icons {
        display: flex;
        justify-content: flex-end;
      }
    `,
  ],
})
export class CustomHeaderRendererComponent implements IHeaderAngularComp {
  public params: any;

  agInit(params: any): void {
    this.params = params;
  }
}

2. 在使用Ag Grid的组件中，使用自定义的头部渲染器 app.component.ts：

import { Component } from '@angular/core';
import { ColDef } from 'ag-grid-community';

@Component({
  selector: 'app-root',
  template: `
    
  `,
})
export class AppComponent {
  public rowData: any[];
  public columnDefs: ColDef[];

  constructor() {
    this.rowData = [
      { make: 'Toyota', model: 'Celica', price: 35000 },
      { make: 'Ford', model: 'Mondeo', price: 32000 },
      { make: 'Porsche', model: 'Boxster', price: 72000 },
    ];

    this.columnDefs = [
      {
        headerName: 'Make',
        field: 'make',
        headerComponentFramework: CustomHeaderRendererComponent,
      },
      { headerName: 'Model', field: 'model' },
      { headerName: 'Price', field: 'price' },
    ];
  }
}

3. 在你的模块中引入自定义的头部渲染器组件 app.module.ts：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AgGridModule } from 'ag-grid-angular';

import { AppComponent } from './app.component';
import { CustomHeaderRendererComponent } from './custom-header-renderer.component';

@NgModule({
  declarations: [AppComponent, CustomHeaderRendererComponent],
  imports: [BrowserModule, AgGridModule.withComponents([CustomHeaderRendererComponent])],
  providers: [],
  bootstrap: [AppComponent],
})
export class AppModule {}

以上代码示例演示了如何定义和使用自定义的头部渲染器组件CustomHeaderRendererComponent来替代默认的头部渲染器。在这个示例中，自定义的头部渲染器显示列的名称，并添加了排序和过滤的图标。