Ionic2 accesing variables in nested methods of cordova plugin

Question

I am developing mobile app with ionic2(beta 8,Cordova 6.2) latest and facing issue to accessing variable in cordova mehtod(Functions).My code is like

import {Page, NavController, Alert, NavParams} from 'ionic-angular';
import {StatusBar,cordovaBeacon} from 'ionic-native'; 
import {AuthService} from '../home/authservice'; 
import {HomePage} from '../home/home';


export class UserPage {
    constructor(authservice, navcontroller) {
        this.service = authservice;
        this.nav = navcontroller;
        this.distance = 0;    
    }

    getDistance(){               
       this.distance=-50;//This is working and change view perfactly

       var delegate = new cordova.plugins.locationManager.Delegate();

       delegate.didRangeBeaconsInRegion = function (pluginResult) {
           //I got reading of beacons but can't access distance variable to change distance in associate view
           this.distance=pluginResult.beacons[0].rssi;
           /*This wan't work, can't access this.distance variable         to update(View) proximity of ibeacon in delegete method*/
       }; 

       var uuid = '33333333-3333-4444-5555-666666666666 ';
       var identifier = 'BEacon 2';
       var minor = '1';
       var major = '1';

       var beaconRegion = new cordova.plugins.locationManager.BeaconRegion(identifier, uuid, major, minor);

      cordova.plugins.locationManager.setDelegate(delegate);
      cordova.plugins.locationManager.requestWhenInUseAuthorization();
      cordova.plugins.locationManager.requestAlwaysAuthorization();

      cordova.plugins.locationManager.startRangingBeaconsInRegion(beaconRegion)
          .fail(function(e) { console.error(e); })
          .done();
    }
 }

Using this plugin for beacon detection 1) https://github.com/petermetz/cordova-plugin-ibeacon/

So Questions are

1. Any global variable for ionic2 that can accessible anywhere?
2. Any other workaround of above given issue?

Please Advice -Naitik

Answer 1

If you use arrow notation you will maintain this context:

constructor(authservice, navcontroller, ngzone) {...}

 delegate.didRangeBeaconsInRegion = (pluginResult) => {
           this.ngzone.run( () => {
               this.distance=pluginResult.beacons[0].rssi;           
           });
       }; 

Edit:

Additionally, since this will run outside the angular zone, you need to wrap it within an angular ngZone.