how to give a default value to ag-grid filter

Question

Trying to display a default value in ag-grid filter text . In filter param I want to give a default value to be displayed to user not only to be applied on the result

this.columnDefs = [
  {
    headerName: this.pageData["tbm.line.list.grid.phonenumber"],
    field: 'tn',
    /*sort: "asc",*/
    sortable: true,
    filter: "agTextColumnFilter",
    filterParams: { filterOptions: ['contains'], apply: true },
    //tooltip: (params) => 'Address: ' + params.value,
    headerTooltip: 'Phone Number',
    // editable: true,
    // checkboxSelection: true,
    // headerCheckboxSelection: true,
    // headerCheckboxSelectionFilteredOnly: true,
    width: 150
  },

Answer 1

If you want to set a default value on you filter, you can make use of the firstDataRendered event, and set the initial filter model.

<ag-grid-angular
  #agGrid
  style="width: 100%; height: 100%;"
  id="myGrid"
  class="ag-theme-balham"
  [columnDefs]="columnDefs"
  [defaultColDef]="defaultColDef"
  [rowData]="rowData"
  (gridReady)="onGridReady($event)"
  (firstDataRendered)="onFirstDataRendered($event)"
></ag-grid-angular>

And on your component.ts,

onFirstDataRendered() {
  const yourFilterComponent = this.gridApi.getFilterInstance('athlete');
  yourFilterComponent.setModel({
    type: 'contains',
    filter: 'Phelps'
  });
  this.gridApi.onFilterChanged();
}

I have created a demo over here.

Answer 2

A little change in above answer worked for me. In .ts instead setModel() i have uses setFilterModel for apiGrid.

<ag-grid-angular
  #agGrid
  style="width: 100%; height: 100%;"
  id="myGrid"
  class="ag-theme-balham"
  [columnDefs]="columnDefs"
  [defaultColDef]="defaultColDef"
  [rowData]="rowData"
  (gridReady)="onGridReady($event)"
  (firstDataRendered)="onFirstDataRendered($event)"
></ag-grid-angular>

And on your component.ts,

onFirstDataRendered() {
  this.gridApi.setFilterModel({
  "year": {
    filterType: 'set',
    values: ["2010"],
  }
})
  this.gridApi.onFilterChanged();
}