Wie Wert auf einen AngularJS $ http Erfolg Rückruf passieren

Question

In meiner AngularJS Anwendung ich die

$http.get('/plugin/' + key + '/js').success(function (data) { 
    if (data.length > 0) { 
     console.log(data); 
     // Here I would also need the value of 'key' 
    } 
}); 

Jetzt muss ich Zugriff auf den key Wert innerhalb des Erfolgs Rückruf folgenden tue, also muss ich wissen, was Wert hatte es, als die get() Anfrage gemacht wurde.

Irgendwelche "Best Practice", wie man das macht?

PS: Ich kann folgendes tun, aber gibt es einen besseren Weg?

var key = config.url.split('/')[2]; 

Answer 1

Lösung 1:

$scope.key = key; 
$http.get('/plugin/' + key + '/js').success(function (data) { 
    if (data.length > 0) { 
     console.log(data, $scope.key); 
    } 
}); 

Lösung 2 (Stand per Jim Hong Beobachtung in seiner Antwort):

$http.get('/plugin/' + key + '/js').success((function(key) { 
    return function(data) { 
     console.log(key, data); 
    } 
})(key)); 

Answer 2

Referenz Die Arbeitslösung auf meiner Seite @geniuscarrier ist

$http.get('/plugin/' + key + '/js').success((function(key) { 
    return function(data) { 
     console.log(key, data); 
    } 
})(key)); 

Da mit @geniuscarrier erhalten I'l

undefiniert Fehlerdaten

.

Answer 3

Technisch gesehen ist dies kein AngularJS Problem, sondern ein Merkmal javascript

zunächst, Funktionen, die Sie in einem Umfang definiert lokalen Zugriff auf Variable haben und Parameter seiner Eltern Umfang

function parent(arg){ 
    var local 
    function child(){ 
     // have access to arg and local 
    } 
} 

Scope funktioniert tatsächlich gut mit der Eltern-Kind-Analogie: Wenn Sie die Eltern sind und Sie eigenen ein Cookie, aus Grund sind Sie wohl, es mit Ihren Kindern zu teilen ... aber wenn Sie ein Kind sind ... Ihr Cookie ist Ihr Cookie, Ihre Eltern dürfen es nicht berühren :). Mit anderen Worten, kann innerer Umfang äußeren Umfang zuzugreifen, aber es funktioniert nicht in beiden Richtungen

So sollten Sie definitiv in der Lage sein zu tun:

$http.get('/plugin/' + key + '/js').success(function (data) { 
    if (data.length > 0) { 
     console.log(data, key); //as long as you can pass it to $http.get as an argument 
           //you can access it here 
    } 
}); 

Zweitens wegen der ereignisgesteuerten Art von JavaScript, inner function store references to the outer function’s variables .Sie haben wahrscheinlich von diesen

Funktionen in Javascript zu hören sind Objekte

lokale Variablen und Parameter so private Mitglieder der Funktion sind:

function ObjectA(){ // define a constructor 
    var x = 10  // private variable 
    changeX : function(){ 
        x = 20 // access and MODIFY a variable of parent scope 
       } 
} 

, wenn Sie, wie private Variable Werke verstehen in JavaScript, dann verstehen Sie im Grunde, was Verschluss ist. Daher ist es sehr wahrscheinlich, dass zum Zeitpunkt der Auslösung der Wert der übergeordneten Bereichsvariablen bereits geändert wurde. Um dies zu beheben, können Sie ein sofort aufgerufen Funktion Expression verwenden (IIFE)

$http.get('/plugin/' + key + '/js').success((function(currentKeyValue) { 
    return function(data) { 
     console.log(currentKeyValue, data); 
     // again, currentKeyValue is a REFERENCE to outer function's 
     // parameter. However, since String is passed by value in javascript 
     // currentKeyValue of outer scope is a DIFFERENT string that has the 
     // same value as KEY when it is invoked 
    } 
})(key)); // immediately invoke the function passing the key as a parameter 

Answer 4

Statt Umfang verschmutzt oder mit iif kompliziert, eine andere saubere Weise ist eine Callback-Funktion zu erstellen, und nennen Sie es mit den Parametern;

var myCallBack = function (key) { 
    return function (data) { 
    if (data.length > 0) { 
     console.log(data, key); 
    } 
    } 
} 

$http.get('/plugin/' + key + '/js').success(myCallBack(key)); 

Answer 5

Puh, ich war auf der Suche nach dieser Antwort so lange, aber es ist gut, es ist hier. Nur um es zu aktualisieren, da die Legacy-Versprechungsmethoden success und error veraltet sind und wir stattdessen die Standardmethode then verwenden sollten.

Lösung 2 in @geniuscarrier und @ jim-horng Antworten kann wie folgt neu geschrieben werden:

$http.get('/plugin/' + key + '/js').then(
    (function(key) { 
     return function(data) { 
      console.log(key, data); 
     } 
    })(key), 
    function(data) { 
     //error handle 
    });