Scoping issues while using context menu

Question

I'm following the docs here to add a context menu item to my grid. The issue is that from the scope of getContextMenuItems (in the example), I'm unable to access any other methods or variables in my component. Is this possible? Example below:

private varIWantToAccess: boolean = false;

function getContextMenuItems(params) {
    var result = [
    { // custom item
        name: 'Alert ' + params.value,
        action: function () 
    {
        window.alert('Alerting about ' + params.value);
        this.varIWantToAccess = true; // Builds fine, but throws a run time exception, since this "this" context is different than the one that has "varIWantToAccess"
    }
    },
        ....
        return result;
}

Thanks!

Answer 1

I assume that you are speaking of an Angular 2 or 4 component using TypeScript. If so then use fat arrow to connect to your function.

Example:

gridOptions.getContextMenuItems = () => this.getContextMenuItems();

This should provide you the scope you need.