контроллер Initialize по запросу АЯКС

Question

У меня есть контроллер AngularJs:

function MyController($scope, $http) { 
    // as $http.get() is async, success() returns promise but 
    // I need the actual value 'items' 
    var promise = $http.get(...) 
     .success(function(response) {return response.items;}); 
    <waitForAjaxCall> 
    $scope.items = promise.get?(); 
    $scope.firstItem = $scope.items[0]; 

    //do stuff using $scope.firstItem 
} 

var myApp = angular.module('myApp',[]); 
myApp.controller('MyController', ['$scope', '$http', MyController]); 

Как я могу гарантировать, что $scope.items инициализируется значением, возвращаемым вызовом АЯКС перед $scope.firstItem = ... задания? Другой подход, который я вижу, состоит в том, чтобы обернуть items в фабрику angularjs, которая вызывает $ http, но мне все еще нужно ждать, пока вызов ajax будет завершен внутри этой фабрики.

Answer 1

Вы не можете ждать синхронно для завершения вызова Ajax. Вы должны инициализировать сферу в success обратного вызова:

function MyController($scope, $http) { 
    function init(items) { 
     $scope.items = items; 
     $scope.firstItem = $scope.items[0]; 

     //do stuff using $scope.firstItem 
    } 

    $http.get(...) 
     .success(function(data) { 
      init(data.items);    
     }); 
} 

Answer 2

Я бы на самом деле просто сделать это:

<div>{{items[0].name}}</div> 

Когда $scope.items установлен, первый элемент будет связан там.