AngularJSがデータを返さないようにリクエストします

Question

私はJSONファイルを取得し、その内容を$ scopeに添付しようとしています。

最初のconsole.logは必要な結果を返しますが、2番目の数値は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

これはPromisesと呼ばれる理由があります。私は間違いなくそれらを調べている。

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

私はJSONデータを取得したいのjavascriptを伝えます：ここでの順序で何が起こるかの一種です。しかし、実際にはまだそれを取得していません。その後、コンソールログを実行します。

console.log($scope.data) 

Well $ 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

Answer 2

AngularJSの$http.get()のthen()コールバックが非同期的に呼び出されます。

つまり、コールバックでは機能しますが、2番目のコールバックでは機能しません。

Answer 3

あなたのデータは保存されています。しかし、2番目のconsole.log（）が実行された時点ではありません。 "then"約束/コールバックは、の2番目のconsole.log（）の後にで実行されます。テンプレートに$ scope.dataが必要な場合、これはうまくいくはずです。角度のダイジェストサイクルは、$ httpsのコールバックの後に実行されます。