javascript - 如何正确处理 AngularJS 中的变量范围

Question

在我的 AnlgularJS Controller 中，我的首要任务是确定应用程序是在开发还是测试中运行。

为了这个目的，我调用了一个 api，一个回复(该部分已验证有效)。

根据环境，我需要设置 $scope.uploadUrl 的值，这样我的文件 uploader 指令就会知道哪个 url 是其文件上传的目标。

由于某种原因，在执行上传程序时，该 url 值已丢失。

这是我的 Controller 的相关部分:

$scope.uploadUrl = '';

        console.log('This is FileUploadController');

        function getEnvironment (){
            $http.get('/environment').success(function(response) {
               $scope.currentEnvironment = response.environment;
                if(response.environment === 'test'){
                   $scope.uploadUrl = 'http://test_url:3001/api/files';
                }
                if(response.environment === 'dev'){
                  $scope.uploadUrl = 'http://dev_url:3000/api/files';
                }
                console.log('Current Environment is:  ' + $scope.currentEnvironment
                + '  so the uploadUrl should be:  ' + $scope.uploadUrl);
            });
        }

        getEnvironment();

        var selectedCategory;
        var selectedDataVersion;

        var uploader = $scope.uploader = new FileUploader({
            //url: 'http://dctool-lnx.cloudapp.net:3001/api/files',
            url:    $scope.uploadUrl,
            tabName: 'sheet1'
        });

重新构建此代码的正确方法是什么，以使值在我的 getEnvironment 函数中设置得足够长？

Answer 1

For some reason, by the time the uploader is executed, that url value is lost.

并非如此，实际原因是在执行上传时，url 值尚未分配，因为分配该值的操作本质上是异步的 (AsycJAX)。

所以基本上您需要等待该操作完成，您可以利用操作返回的 promise 来完成。

    //return promise from the function
    function getEnvironment (){
      return  $http.get('/environment')....
    }

    //Make a call chain it through and register runUploader
    getEnvironment().then(runUploader);

    var selectedCategory;
    var selectedDataVersion;

    function runUploader(){
       var uploader = $scope.uploader = new FileUploader({
         //url: 'http://dctool-lnx.cloudapp.net:3001/api/files',
         url:    $scope.uploadUrl,
         tabName: 'sheet1'
       });
    }