只有在angular服务从服务器获取数据并完成执行后,才能执行特定的代码块

Executing certain block of code only after angular service gets data from server and completes its execution

本文关键字:执行 代码 服务 angular 服务器 数据 获取      更新时间:2023-09-26

在我的服务中:

appRoot.factory('ProgramsResource', function ($resource) {
    return $resource('Home/Program', {}, { Program: { method: 'get', isArray: false } })
});

在我的控制器中:

appRoot.controller('ProgramCtrl', function ($scope, ProgramsResource) {
    $scope.searchPrograms = function () {
        $scope.Programs = ProgramsResource.get(
            {
                Name: $scope.searchProgramName,
            });
    };
    $scope.SortBy = "Name";
    $scope.searchPrograms();
    //Lines of code which I want to execute only after the searchPrograms() completes its execution
    $scope.TotalItems = $scope.Programs.TotalItems;
    $scope.ItemsPerPage = $scope.Programs.ItemsPerPage;
});

searchPrograms()负责从服务器获取数据。并且仅在第$scope.searchPrograms()行之后我想执行以下代码:

$scope.TotalItems = $scope.Programs.TotalItems;
$scope.ItemsPerPage = $scope.Programs.ItemsPerPage;

但事情并非如此。它不是在等待searchPrograms()完成操作并执行下面的代码行。在js中,它不会等待ajax完成并执行下面的行,这是正在发生的。为了只在ajax完成后执行某些代码,js中有回调函数的概念,而angular中也有promise的概念。

我收到了一篇关于棱角分明的承诺的文章,但我不明白,在我的情况下,我应该如何使用这些承诺。

您可以在ProgramResource.get:中添加回调函数参数

   $scope.searchPrograms = function () {
        $scope.Programs = ProgramsResource.get(
            {
                Name: $scope.searchProgramName,
            }, function () { 
                $scope.TotalItems = $scope.Programs.TotalItems;
                $scope.ItemsPerPage = $scope.Programs.ItemsPerPage;
            });
    };

您应该使用$q和递延承诺,这样您就可以执行类似的操作

 $scope.searchPrograms().then(function(data) { // data is the data that search programs should return
   $scope.TotalItems = $scope.Programs.TotalItems;
   $scope.ItemsPerPage = $scope.Programs.ItemsPerPage;
 }

确保searchPrograms返回promise。

        var deferred = $q.defer();
        var callback = function (response) {
            if(response.error) {
                deferred.reject(response.error)
            }
            deferred.resolve(response);
        };
        //Your service call that need a callback like myService.request(callback);
        return deferred.promise;

因此,当请求完成时,代码将在.then(function(data) { 中执行