在 angularJs 中从控制器调用同时$http服务

Calling simultaneous $http services from controller in angularJs?

本文关键字:http 服务 调用 angularJs 控制器      更新时间:2023-09-26

我正在从angularJs中的控制器调用许多服务,我的一些代码依赖于其他服务结果。有时它运行良好,但有时我会收到未定义的错误,因为服务执行未完成。

如果我正在等待服务执行完成(嵌套代码,即一个服务在另一个服务成功函数等中),这意味着嵌套的$http请求在父完成后只启动一次,会影响性能。我可以解决这种情况吗?

示例代码,

              //init client list
            clientService.list().success(function (data, status) {
                $scope.clients = data.data;
                console.log('clients retrieved');
                //sales person
                settingService.getSalesPerson().success(function (data, status) {
                    $scope.sales_persons = data;
                    console.log('sales persons retrieved');
                    //init item list
                    itemService.list().success(function (data, status) {
                        $scope.items = data.data;
                        console.log('items retrieved');
                        //quotation settings
                        settingService.getQuotationSettings().success(function (data, status) {
                            var qty = data[0];
                            $scope.quotation.note = data[0].note;
                            $scope.quotation.terms_and_condition = data[0].terms_and_condition;
                            console.log('settings retrieved');
                            //when change client,updating the address
                            var watchClientModel = function () {
                                $scope.$watch('selectedClient', function () {
                                    $scope.quotation.client_id = $scope.selectedClient.id;
                                    $scope.quotation.billing_street = $scope.selectedClient.address_info.billing_street;
                                    $scope.quotation.billing_city = $scope.selectedClient.address_info.billing_city;
                                    $scope.quotation.billing_pobox = $scope.selectedClient.address_info.billing_pobox;
                                    $scope.quotation.billing_country = $scope.selectedClient.address_info.billing_country;
                                    $scope.quotation.shipping_street = $scope.selectedClient.address_info.shipping_street;
                                    $scope.quotation.shipping_city = $scope.selectedClient.address_info.shipping_city;
                                    $scope.quotation.shipping_pobox = $scope.selectedClient.address_info.shipping_pobox;
                                    $scope.quotation.shipping_country = $scope.selectedClient.address_info.shipping_country;
                                });
                            };
                            var watchSalesPersonModel = function () {
                                $scope.$watch('selectedPerson', function () {
                                    $scope.quotation.sales_person_id = $scope.selectedPerson.id;
                                    console.log('Sales person updated');
                                });
                            };
                            //when udpate
                            if ($scope.isUpdate) {
                                //Create Quotation
                                $scope.pageTitle = "Edit Quotation";
                                $scope.pageTitleIcon = "fa fa-pencil";
                                //init quotaion details
                                quotationService.get($routeParams.quotationId).success(function (data, status) {
                                    $scope.quotation = data;
                                    //get clients
                                    $scope.selectedClient = _.findWhere($scope.clients, {id: $scope.quotation.client_id});
                                    console.log('Client preselected');
                                    //get sales person
                                    $scope.selectedPerson = _.findWhere($scope.sales_persons, {id: $scope.quotation.sales_person_id});
                                    console.log('Sales  person preselected');
                                });
                            } else {
                                //when insert
                                $scope.selectedClient = $scope.clients[0];
                                $scope.selectedPerson = $scope.sales_persons[0];
                                $scope.quotation.items.push({
                                    'item': null,
                                    'quantity': 0.00,
                                    'rate': 0.00
                                });
                                if (qty.auto_generate) {
                                    $scope.quotation.quotation_number = qty.prefix_string + 1000 + Math.floor((Math.random() * 100000) + 1);
                                }
                            }
                            watchClientModel()
                            watchSalesPersonModel();
                        });
                    });
                });
            });

在这里,我将所有服务调用作为嵌套 ladder.it 工作正常但会影响性能。

如果我把外面的所有服务呼叫都带回来,得到错误是$scope.selectedClient is undefined

如果您有不相互依赖的查询,则可以彼此分开执行它们,然后等待结果:

//init client list
var clients = clientService.list().success(function (data, status) {
    $scope.clients = data.data;
    console.log('clients retrieved');
});
//sales person
var sales = settingService.getSalesPerson().success(function (data, status) {
    $scope.sales_persons = data;
    console.log('sales persons retrieved');
});
//init item list
var items = itemService.list().success(function (data, status) {
    $scope.items = data.data;
    console.log('items retrieved');
});
//quotation settings
var quotes = settingService.getQuotationSettings().success(function (data, status) {
    $scope.qty = data[0];
    $scope.quotation.note = data[0].note;
    $scope.quotation.terms_and_condition = data[0].terms_and_condition;
    console.log('settings retrieved');
});
//when change client,updating the address
$scope.$watch('selectedClient', function () {
     var selectedClient = $scope.selectedClient,
         address_info = selectedClient.address_info,
         quotation = $scope.quotation;
     quotation.client_id = selectedClient.id;
     quotation.billing_street = address_info.billing_street;
     quotation.billing_city = address_info.billing_city;
     quotation.billing_pobox = address_info.billing_pobox;
     quotation.billing_country = address_info.billing_country;
     quotation.shipping_street = address_info.shipping_street;
     quotation.shipping_city = address_info.shipping_city;
     quotation.shipping_pobox = address_info.shipping_pobox;
     quotation.shipping_country = address_info.shipping_country;
});
$scope.$watch('selectedPerson', function () {
    $scope.quotation.sales_person_id = $scope.selectedPerson.id;
    console.log('Sales person updated');
});
// when all finished loading
$q.all([clients, sales, items, quotes]).then(function () {
    // when udpate
    if ($scope.isUpdate) {
        //Create Quotation
        $scope.pageTitle = "Edit Quotation";
        $scope.pageTitleIcon = "fa fa-pencil";
        //init quotaion details
        quotationService.get($routeParams.quotationId).success(function (data, status) {
            $scope.quotation = data;
            //get clients
            $scope.selectedClient = _.findWhere($scope.clients, {id: $scope.quotation.client_id});
            console.log('Client preselected');
            //get sales person
            $scope.selectedPerson = _.findWhere($scope.sales_persons, {id: $scope.quotation.sales_person_id});
            console.log('Sales  person preselected');
        });
    } else {
        //when insert
        $scope.selectedClient = $scope.clients[0];
        $scope.selectedPerson = $scope.sales_persons[0];
        $scope.quotation.items.push({
            'item': null,
            'quantity': 0.00,
            'rate': 0.00
        });
        if (qty.auto_generate) {
            $scope.quotation.quotation_number = $scope.qty.prefix_string + 1000 + Math.floor((Math.random() * 100000) + 1);
        }
    }
});