第一次http呼叫完成后呼叫第二个http呼叫

时间:2016-05-09 06:08:18

标签: angularjs http

这是我保存数据并返回结果的服务

nurseService.js

(function () {
    'use strict';

    angular.module('app.services')
        .factory('NurseService', NurseService);

    NurseService.$inject = ['$http', '$q','Constants'];
    function NurseService($http, $q, Constants){
        var service = {
            saveSample:saveSample
        };

        return service;



     function saveSample(data) {
         var deferred = $q.defer();
         $http({method:"POST", data:data, url:Constants.API_URL_SAVE_SAMPLE_COLLECATION}).then(function(result){
            return  deferred.resolve(result.data);
        });
    };
    return deferred.promise;
    }


})();

这是控制器,我使用返回值并根据返回的值调用另一个http get方法并打印它。

 vm.saveSamples = function() {
   var data = {
    visitId: visitId,
    orders: vm.gridTestApi.selection.getSelectedRows()
   };
   var url = Constants.API_URL_SAVE_SAMPLE_COLLECATION;
   var barCodeResponse = null;
   var sampleId = "";


   var myDataPromise = NurseService.saveSample(data);
   myDataPromise.then(function(result) {  
        console.log("data.name"+ JSON.stringify(result));
        vm.printBarCode(result.sampleId);
       // if(sampleId != ""){
           printElement("printThisElement");
       // }
   });

   //Barcode method this should call after saving the data and returned the sampleId
   vm.printBarCode = function(sampleId) {
         $http.get("master/barcode/"+sampleId).then(function (response) {
             vm.barCodeImage = angular.copy(response.data.result);
       });
   }

但是在保存打印正在调用之前。我怎么能在第二次http调用条形码和打印之前完成第一次调用

//打印代码

function printElement(elem) {

     var printSection = document.getElementById('printSection');

       // if there is no printing section, create one
       if (!printSection) {
           printSection = document.createElement('div');
           printSection.id = 'printSection';
           document.body.appendChild(printSection);
       }

       var elemToPrint = document.getElementById(elem);
       // clones the element you want to print
       var domClone = elemToPrint.cloneNode(true);
       printSection.innerHTML = '';
       printSection.appendChild(domClone);
       window.print();

       window.onafterprint = function () {
           printSection.innerHTML = '';
       }
   };

2 个答案:

答案 0 :(得分:2)

您必须在$http中返回printBarCode来电并使用.then,如下所示:

//Barcode method this should call after saving the data and returned the sampleId
vm.printBarCode = function(sampleId) {
    return $http.get("master/barcode/"+sampleId).then(function (response) {
        vm.barCodeImage = response.data.result;
    });
}

myDataPromise.then(function(result) {  
    console.log("data.name"+ JSON.stringify(result));
    return vm.printBarCode(result.sampleId)     
}).then(
    function() {
        printElement("printThisElement");
    },
    function(error) {
        // error handler
    }
);

printElement现在将等待printBarCode承诺,然后在执行前完成。

在进行$q.defer通话时,您也不必使用$http$http已经是承诺,所以您可以这样返回:

function saveSample(data) {
    return $http({method:"POST", data:data, url:Constants.API_URL_SAVE_SAMPLE_COLLECATION})
        .then(
            function(result) {
                return result.data;
            },
            function(error) {
                // don't forget to handle errors
            }
        );
}

答案 1 :(得分:0)

首先,$ http在内部实现了你没有明确创建它们的承诺。

其次,您应该将所有http请求放在服务/工厂

修改后的代码看起来像

angular.module('app.services')
  .factory('NurseService', function($http){
    var service = {
    saveSample : function(data){
    //first http implementation here
    return $http.post(....);
    }
    getBarcode : function(sampleId){
    //http implementation here for barcode
    return $http.get(....);
    }
  }
  return service;
});

并且您的控制器可以使用

之类的服务
angular.module('app.services')
  .controller('saveSampleCtrl',function($scope,NurseService){
    var postData = {
    //your post data here
    }
    NurseService.saveSample(postData)
    .then(function(data){
    //read sampleId here from data
    var sampleId = data.sampleId;
    NurseService.getBarcode(sampleId)
    .then(function(){
    //your print statement here
  });
});
}

代码中可能存在拼写错误但这只是关于如何做到这一点的基本想法。希望它有所帮助