如何將價值傳遞給AngularJS $ HTTP成功回調

Question

在我的AngularJS應用我做了以下

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

現在我需要成功回調中訪問key值，即我需要知道哪些當請求發出get()時，它具有的值。

任何「最佳實踐」如何去做？

PS：我可以做以下，但有沒有更好的方法？

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

Answer 1

解決方案1：

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

解決方案2（每吉姆香港的觀察更新了他的答案）：

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

Answer 2

參考@geniuscarrier 在我身邊的工作方案是

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

由於使用@geniuscarrier，I'l得到

數據未定義的錯誤

。

Answer 3

從技術上講，這不是一個AngularJS問題，而是功能的JavaScript

首先，你一個範圍內部定義功能將有機會獲得局部變量和參數其父範圍

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

範圍實際上與父母和子女的比喻效果很好：如果你是父母，並且你自己自己的一個cookie，因爲你正在分享它與你的孩子......但如果你是一個孩子......你的餅乾是你的 cookie的，你的父母不允許觸摸它:)。換句話說，內部範圍內可以訪問外部範圍，但它不能正常工作兩者兼得

所以，你一定要能夠做到：由於JavaScript代碼的事件驅動性質， inner function store references to the outer function’s variables

$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 
    } 
}); 

其次， 。你可能已經在JavaScript中聽說過這個

函數是對象

局部變量和參數的功能從而私有成員：

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

如果你能理解如何私有變量工作在javascript中，那麼你基本上明白了什麼關閉是。因此，對於回調函數，很可能在觸發時，父範圍變量的值已經改變。爲了解決這個問題，你可以使用一個立即調用函數表達式（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

相反污染範圍或IIF複雜的，另一種更清潔的方式是創建一個回調函數和帶參數調用它;

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

唉，我一直在尋找這個答案這麼久，但它是好的，它在這裏。只是爲了更新它，因爲傳統承諾方法success和error已被棄用，我們應該使用標準then方法。

解決方案2中@geniuscarrier和@吉姆紘答案可能被改寫這樣的：

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