ag-grid destroyed warning when routing to another component and then coming back to the grid component

How can I get rid-off this warning?

Above is the warning I'm getting in google dev tool console:

ag grid: grid api function setRowData() cannot be called as the grid has been destroyed.
Pleased don't call grid API functions on destroyed grids - as a matter of fact you shouldn't be keeping the API reference, your application has a memory leak! Remove the API reference when the grid is destroyed.

Below is the .ts code:

gridApi: any;

@Input()
data: any;
@Input()
gridOptions: any;
@Input()
columnDefs: any;

onGridReady(params: any) {
  this.gridApi = params.api;
  this.data.subscribe((data: any) => {
    params.api.setRowData(data);
    });
}

This error happens when I route to another component and then come back to this component.
versions:
ag-agrid: v29
angular: v15

It's hard to tell without a working example.

Is this.data an Observable? If you are being warned of a memory leak then please try this:

onGridReady(params: any) {
  this.gridApi = params.api;
  this.data
    .pipe(take(1))
    .subscribe((data: any) => {
      params.api.setRowData(data);
    });
}

Subscribing to observables without using .pipe(take(<number>)) is a classic source of memory leaks.
Have a read of

https://www.learnrxjs.io/learn-rxjs/operators/filtering/take#why-use-take

or

https://medium.com/@sub.metu/angular-how-to-avoid-memory-leaks-from-subscriptions-8fa925003aa9

The above answer has nothing to do with this issue. The problem is navigating to a page while the subscription is still running will cause the process to still continue even when navigating away from the component. This is easily reproducible in code

onGridReady(params: any) {
  this.gridApi = params.api;
  this.data
    .pipe(take(1))
    .subscribe((data: any) => {
     if(params.api.destroyCalled){  <--- Had to check here if destroyed was called while the data is being fetched from the service.
          return;
        }
      params.api.setRowData(data);
    });
}

If the destroyed was called before the service returned, then it will still continue to setRowData which will throw the error.

The above answer has nothing to do with this issue. The problem is navigating to a page ... - this comment is correct.
you need to check !gridApi.destroyCalled

in angular/ts destroyCalled it will not compile as property is private and no accessor provided but it can be bypassed as !this.gridApi['destroyCalled']