AngularJS get请求不返回数据

AngularJS get request not returning data

本文关键字：返回 数据 请求 get AngularJS      更新时间：2023-09-26

我有以下代码，其中我试图获得JSON文件并将其内容附加到我的$作用域。

第一个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)
}]);

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

这意味着在回调中，它将工作，但不是在第二个。

这样做的原因是一个叫做Promises的东西。我绝对建议你调查一下。下面是按顺序发生的事情:

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

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

console.log($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

好了，您的数据被存储了。但不是在执行第二个console.log()时。"then"承诺/回调将在第二个console.log()之后运行。如果需要$scope。数据在你的模板，这应该工作。angular的摘要循环将在$https回调之后运行。

相关文章：