如何在ng-controller中提供延迟

Question

一旦加载了Html页面，它就会调用SuperCategoryController，在那里我将超级类别赋值给$scope变量。

$scope.SuperCategories = SuperCategoryService.GetSuperCategories();

但是由于该控制器依赖于服务，而服务又调用http请求。因此，此时pf分配http请求未完成。所以$scope.SuperCategories被分配给了未定义的。

sampleApp.service('SuperCategoryService', ['$http', function ($http){

    var URL = 'http://localhost/cgi-bin/superCategory.pl';
    var SuperCategories;

    $http({
            method: 'POST',
            url: URL,
            data: "action=GET",
            headers: {'Content-Type': 'application/x-www-form-urlencoded'}
        }).
        success(function (data) {
            alert (data);
            if (data != null || data != 'undefined') {
                SuperCategories = data;
            }   

        })
        .error(function (error) {
            alert (error.message);
            //$scope.status = 'Unable to retrieve super categories' + error.message;
        }); 

    //simply returns the SuperCategories list
    this.GetSuperCategories = function () {
        //alert (SuperCategories);
        return SuperCategories;
    }
}]);



sampleApp.controller('SuperCategoryController', ['$scope', 'SuperCategoryService', function ($scope, SuperCategoryService){

    $scope.SuperCategories = SuperCategoryService.GetSuperCategories();

    $scope.LoadSuperCategoryMapping = function()
    {
        alert ($scope.SelectedSuperCategory.id);
    }

}]);

如何以恰当的方式解决这个问题。

Answer 1

我自己还没有试过这段代码，但我会使用工厂和一个承诺来确保数据已经加载的解决方案。大致是这样的：

sampleApp.factory('SuperCategoryService', ['$http', function ($http){

    return {

        GetSuperCategories: function () {

            var URL = 'http://localhost/cgi-bin/superCategory.pl';
            return $http.get(URL);
        }

    }

}]);



sampleApp.controller('SuperCategoryController', ['$scope', 'SuperCategoryService', function ($scope, SuperCategoryService){

    $scope.SuperCategories = function() {

        SuperCategoryService.GetSuperCategories()
            .then(function(d) {
                if (d.data != undefined) {
                    // Your data should be loaded here
                    console.log(d.data);
                    $scope.SuperCategories = d.data;
                }
            })
            .error(function(data, status) {
                // Errors here
            });
    }

}]);