Come posso accedere a "questo" di un controller js angolare, dall'interno di un metodo di promessa?

Question

devo semplice controllore js angolari effettua una richiesta XHR come sotto

app.controller('MainController', ['$http', function($http) { 

    this.php_response = {}; 

    var promise = $http.get('process.php'); 

    promise.then(
     function(success_data) { 

      // I dont think "this" is talking to the controller this anymore?  
      this.php_response = success_data; 

     }, function(error) { 
      console.log('there was a problem'); 
     } 
    ); 

}]); 

Quando scrissi questo controllore utilizzando $scope posto di questo codice funzionato, ora la proprietà this.php_response non è contenente i dati recuperati dalla richiesta XHR.
Sospetto che il callback promise.then#success non faccia più riferimento al controller this.
Come posso accedere a questo, all'interno del metodo di promessa?

Answer 1

Usa arrow function che conserva contesto lessicale:

promise.then(success_data => { 
    this.php_response = success_data; 
}, error => { 
    console.log('there was a problem'); 
}); 

Un altro modo semplice è quello di legare contesto con Function.prototype.bind metodo:

promise.then(function(success_data) { 
    this.php_response = success_data; 
}.bind(this), function(error) { 
    console.log('there was a problem'); 
}); 

E, infine, della vecchia scuola modo: definire il riferimento punta variabile da esterno this e utilizzarlo all'interno della richiamata:

var self = this; 

promise.then(function(success_data) { 
    self.php_response = success_data; 
}, function (error) { 
    console.log('there was a problem'); 
}); 

Qualunque cosa tu preferisca di più.

Answer 2

È inoltre possibile utilizzare angular.bind per questo caso

promise.then(angular.bind(this, function (success_data) { 
    this.php_response = success_data; 
}), function (error) { 
    console.log('there was a problem'); 
});