Question

我有以下代码，我试图获取JSON文件并将其内容附加到我的$ scope。

第一个console.log返回我需要的结果，但第二个返回undefined。

写这个以便存储数据的正确方法是什么？

'use strict';

var myApp = angular.module('myApp.view1', ['ngRoute']);

myApp.config(['$routeProvider', function($routeProvider) {
  $routeProvider.when('/view1', {
    templateUrl: 'view1/view1.html',
    controller: 'View1Ctrl'
  });
}]);


myApp.controller('View1Ctrl', [

  '$scope',
  '$http',

  function($scope, $http) {
    $http.get('view1/info.json')
    .then(function(res){
      $scope.data = res.data.info
      console.log($scope.data)
    });

    console.log($scope.data)
}]);

Answer 1

AngularJS＆＃39; $http.get()的then()回调是异步调用的。

这意味着在回调中它会起作用，但不会在第二个中起作用。

Answer 2

好吧，您的数据已存储。但是当你的第二个console.log（）被执行时却没有。承诺/回调将在第二个console.log（）之后运行。如果您的模板中需要$ scope.data，这应该可行。 Angulars摘要周期将在回调$ https后运行。

Answer 3

这是因为有一个名为Promises的东西。我肯定会考虑他们。以下是按顺序发生的事情：

$http.get('view1/info.json')

告诉javascript我想获取JSON数据。但它实际上还没有得到它。然后，它执行控制台日志。

console.log($scope.data)

$ scope.data未定义。什么都没有设置它！然后，javascript实际上获取了JSON数据。获取数据时，将调用then中的函数。在此之后，

$scope.data = res.data.info
console.log($scope.data)

$scope.data已定义，这就是console.log有效的原因。阅读更多关于承诺的更多信息！

这是一个很好的起点：https://www.youtube.com/watch?v=wA0gZnBI8i4

AngularJS获取请求不返回数据

3 个答案: