debounce a function inside angular

I would like to add debounce for an argument inside a function

I am having issue because Angular debounce only works for pipe and observable, so I use lodash debounce instead.

whenever the clarity datagrid table refresh, it will call onRefreshTable function and pass the event object which has table filter and sorting state.

Since refreshTable() will call API which takes longer time, I would like to minimize the API call.

Sometimes table refresh is being called multiple times with the same argument, or different argument. If different argument, the last table refresh call will contain all of the needed argument to pass to the API.

My atttempt which doesn’t work , it doesn’t call the refreshTable function even after 1seconds.

import * as _ from lodash;
onRefreshTable(event: ClrDatagridStateInterface<any>) {
        _.debounce((event) => {
            this.refreshTable(event), 1000
        });     
}
refreshTable() {
   // save state to the rxjs store 
   // call API which is expensive
}
%d bloggers like this: