How to bind outer 'this' into footerCallback

rajanwalt

I have declared a currency symbol as a global variable and trying to access it inside footerCallback to add that currency symbol with footer values.

If I bind outer 'this' with the footerCallback, I'm getting below error,

ERROR TypeError: this.api is not a function

kthorngren

Not sure I understand the problem. I put this example together based on your description and it works fine. Is this what you are doing?
http://live.datatables.net/

If this doesn't help please provide a test case showing what you are doing. You can update mine if you like.

Kevin

rajanwalt

@kthorngren - Thank you for your response.

I am using jQuery Datatable inside my angular application.

Here's my code logic (typescript):

class DataTable {
currency = '$';
config: any = {
"footerCallback": function( row, data, start, end, display ) {
var api = this.api();
/* Here i want to use the currency (outer 'this');
$(api.column(2).footer()).html(${this.currency} ${sum_Avg});
}
}
}

allan

The classic way is to do var that = this; and then in footerCallback: that.currency.

Alternatively you could use a fat arrow function, but then you won't be able to use this.api()!

Allan

rajanwalt

@allan Thank you for your response.

The classic way saves my life.