AngularJS：访问嵌套在 $scope 中的对象

Question

我一直在尝试解决这个问题，但没有成功。我知道 getCurrentPosition() 返回一个承诺并在 .then() 函数中调用 $scope.map.center 将起作用。我也明白 $scope 在摘要循环中运行，并且它的属性和对象在承诺解决时更新。我对这一切都很陌生，我希望我是有道理的。

也就是说，我很想了解发生了什么，因为 console.log($scope.map) 按预期工作，{{ map.center }} 按预期显示，但 console.log(map.center) 返回.then() 函数之外的空对象。

提前感谢您的帮助！

    $scope.map = {
            control: {},
            center: {},
            zoom: 16
        };

    $geolocation.getCurrentPosition({
        timeout: 60000,
        maximumAge: 250,
        enableHighAccuracy: true
    }).then(function(position) {
        $scope.map.center.latitude = position.coords.latitude;
        $scope.map.center.longitude = position.coords.longitude;
    });


    //Output
    
    console.log($scope.map); //returns full object including data within $scope.map.center

    console.log($scope.map.center); //returns an empty object. I am looking to convert this to an array using lodash. 

 {{ map.center  }} works fine and returns the coordinates of my current location

**编辑（上传的控制台图像）**

This is what I see in the console. First object is $scope.map Second object is $scope.map.center

Answer 1

当 getCurrentPosition 完成时调用 then 函数（它是异步的）并将数据发送回客户端。这是您可以可靠地访问由它检索到的数据的唯一地方。如果要进行异步调用，则必须使用 then 函数来访问数据。 THEN 是调用后发生的事情。 then（函数外部）之后的代码在调用 getCurrentPosition 后立即执行，而不是在它完成时执行。

如果你只是想找一个不同的地方来放置这段代码，你可以在 then 函数之外调用另一个函数并将位置对象传递给它。

$scope.map = {
        control: {},
        center: {},
        zoom: 16
    };

$geolocation.getCurrentPosition({
    timeout: 60000,
    maximumAge: 250,
    enableHighAccuracy: true
}).then( processMap(position))

function processMap(position) {
    $scope.map.center.latitude = position.coords.latitude;
    $scope.map.center.longitude = position.coords.longitude;
    console.log($scope.map); 
    console.log($scope.map.center); 
};

如果您正在寻找有关异步调用的更多信息，请参阅以下说明：

http://docs.apigee.com/api-baas/asynchronous-vs-synchronous-calls

Answer 2

getCurrentPosition() 调用是异步的。因此，您对记录 $scope.map 和 $scope.map.center 的调用只会返回您最初定义的任何内容。

只有 ajax 调用结束时，才会在作用域内设置数据。