http调用Angular后如何更新全局变量

时间:2017-04-21 02:02:59

标签: javascript angularjs

我有一个全局变量,我需要在http get调用后更新。更新后,我需要将此更新的变量传递给其他函数。我不明白什么是最好的方法。这是我的代码:

    app.controller('myCtrl', function($scope, $http) {
     var data = '';
     $http.get("data.json")
       .then(function(response) {
        data = response.data;
     });
     vm.mapOptions = {
        controls: {
            navigator: false
        },
        center: [40, -35],
        zoom: 3,
        layers: [{
            style: {
                fill: {
                    color: '#1996E4'
                },
                stroke: {
                    color: '#FFFFFF'
                }
            },
            type: 'shape',
            dataSource: data
        }],
        shapeCreated: onShapeCreated,
        shapeFeatureCreated: onShapeFeatureCreated
    };
    });

http调用后是否可以更新全局变量?

提前感谢您的帮助。

1 个答案:

答案 0 :(得分:3)

当您执行http请求时,发送请求并获得响应需要一些时间,特别是当您将请求发送到服务器上的API时,但同时执行会立即继续执行并且http调用之后的语句被执行,如果你有一些取决于反应的东西,最合适的将是失败。

在你的情况下vm.mapOptions依赖于data,这是一个从get请求获取respnse的局部变量。那你能做什么?

第1步:

为与您的回复有关的所有代码创建一个函数:

$scope.myCallBack = function(data){
  vm.mapOptions = {
    controls: {
        navigator: false
    },
    center: [40, -35],
    zoom: 3,
    layers: [{
        style: {
            fill: {
                color: '#1996E4'
            },
            stroke: {
                color: '#FFFFFF'
            }
        },
        type: 'shape',
        dataSource: data
    }],
    shapeCreated: onShapeCreated,
    shapeFeatureCreated: onShapeFeatureCreated
   };

}

第2步: 在获得响应后立即调用$ http.get中的myCallBack函数

var data = '';
 $http.get("data.json")
   .then(function(response) {
    data = response.data;
    $scope.myCallBack(data);
 });