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（根据Jim Hong在答案中的观察更新）：

$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后，我得到了

数据未定义错误

Answer 3

从技术上讲，这不是AngularJS问题，而是 javascript

的功能

首先，您在范围中定义的功能将有权访问本地变量和参数其父范围

err = session.Run("en\r")
err = session.Run("password\r")

范围实际上适用于亲子类比：如果您是父母并且拥有一个cookie，因为您很乐意与您的孩子分享...但如果您是小孩......你的cookie是你的 cookie，你的父母不允许触摸它:)。换句话说，内部范围可以访问外部范围，但它不能双向工作

所以你一定能做到：

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

其次，由于javascript的事件驱动性， inner function store references to the outer function’s variables。你可能听说过这个

javascript中的函数是对象

因此，局部变量和参数是函数的私有成员：

$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中的工作原理，那么您基本上可以理解闭包是什么。因此，对于回调函数，很可能在触发时，父作用域变量的值已经改变。要解决此问题，您可以使用立即调用的函数表达式（IIFE）

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

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

Phew，我这么长时间都在寻找这个答案，但它在这里很好。只是为了更新它，因为旧的承诺方法success和error已被弃用，我们应该使用标准的then方法。

@geniuscarrier中的解决方案2和@ jim-horng的答案可能会像这样重写：

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

如何将值传递给AngularJS $ http成功回调

5 个答案: