AngularJS가 데이터를 반환하지 않습니다.

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

이유는 약속이라고하는 것 때문입니다. 나는 그들을 조사하는 것을 확실히 suggets. 여기에 순서대로 일어나는 일이 있습니다 :

그건 JSON 데이터를 얻고 싶습니다. 그러나 아직 실제로 그것을 얻지는 못합니다. 그런 다음 콘솔 로그를 작성합니다.

console.log($scope.data) 

글쎄 $ scope.data는 정의되지 않았습니다. 아무것도 아직 설정하지 않았습니다! 그런 다음 javascript는 실제로 JSON 데이터를 가져옵니다. 데이터를 가져 오면 then 내의 함수가 호출됩니다. 이 후,

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

$scope.data는 이유 console.log 작품 인 정의된다. 자세한 정보에 대한 약속에 대해 자세히 읽어보십시오! 데이터는 ....하지만() 마지막`을 console.log 때까지 (컨트롤러 범위에) 저장되는 https://www.youtube.com/watch?v=wA0gZnBI8i4

Answer 2

AngularJS와의 $http.get()의 then() 콜백은 비동기 적으로 호출된다.

즉, 콜백에서 작동하지만 두 번째 호출에서는 작동하지 않습니다.

Answer 3

음, 데이터가 저장됩니다. 하지만 두 번째 console.log()가 실행될 때가 아닙니다. 두 번째 console.log()는 다음에 "then"약속/콜백이 으로 실행됩니다. 템플릿에 $ scope.data가 필요한 경우이 방법이 효과적입니다. Angulars 다이제스트주기는 $ https의 콜백 이후에 실행됩니다.