在angularJS中的API调用紧接着

时间:2014-12-02 08:28:47

标签: javascript angularjs ionic-framework timeout

我在Ionic移动项目中使用angular时遇到问题,我在桌面环境中使用这段代码很有用。我在一个500ms之后对Web服务器进行三次API调用。但是在使用较低连接的手机中,有时其中一个呼叫失败,因此整个过程失败。 有没有办法在前一个完成的确切时刻进行API调用?我的意思是,不要使用固定的时间。

//get member information
$timeout(function() {
  membersService.getMember(community.url, community.user.api_key, community.user.auth_token, $stateParams.userId).
  success(function(data) {
    $scope.member = data.result;
  });
}, 500);

$timeout(function() {
  messagesService.getConversation(community.url, community.user.api_key, community.user.auth_token, community.user.user_info.guid, $stateParams.userId, "from").
  success(function(data) {
    if(data.result["entities"].length > 0)  {
      messages = messages.concat(data.result["entities"]);
      subject = "Re: "+data.result["entities"][data.result["entities"].length-1].title;
    }
    $scope.messageData.subject = subject;
  });
}, 1000);

$timeout(function() {
  messagesService.getConversation(community.url, community.user.api_key, community.user.auth_token, community.user.user_info.guid, $stateParams.userId, "to").
  success(function(data) {
    log = [];
    if(data.result["entities"].length > 0)  {
      angular.forEach(data.result["entities"], function(v, k) {
        v.owner_guid = $stateParams.userId;
        log.push(v);
      }, log);
      messages = messages.concat(log);
    }
    var log = [];
    var count = 0;
    angular.forEach(messages, function(v, k) {
      messages_reorder.push(v);
    }, log);
  });
}, 1500);

3 个答案:

答案 0 :(得分:1)

这是实现嵌套承诺链的结果:

var loadMemberInfo = function( userId ) 
{
  return membersService
    .getMember(community.url, community.user.api_key, community.user.auth_token, $stateParams.userId)
    .then(function(data) 
    {
      $scope.member = data.result;
    });
},
getConversationFrom = function()  {
  return messagesService
  .getConversation(community.url, community.user.api_key, community.user.auth_token, community.user.user_info.guid, $stateParams.userId, "from")
  .then(function(cf) {
    if(cf.data.result["entities"].length > 0)  {
      messages = messages.concat(cf.data.result["entities"]);
      subject = "Re: "+cf.data.result["entities"][cf.data.result["entities"].length-1].title;
    }
    $scope.messageData.subject = subject;
  });
},
getConversationTo = function()  {
  messagesService
  .getConversation(community.url, community.user.api_key, community.user.auth_token, community.user.user_info.guid, $stateParams.userId, "to")
  .then(function(ct) {
    log = [];
    if(ct.data.result["entities"].length > 0)  {
      angular.forEach(ct.data.result["entities"], function(v, k) {
        v.owner_guid = $stateParams.userId;
        log.push(v);
      }, log);
      messages = messages.concat(log);
    }
    //order array
    messages = messages.sort(function(a,b) { return a.time_created - b.time_created } );

    var log = [];
    var count = 0;

    angular.forEach(messages, function(v, k) {
      messages_reorder.push(v);
    }, log);
  });
},
orderFullConversation = function()  {
  $ionicLoading.hide();
  console.log(messages);
  if(messages_reorder.length > 5) {
    var messages_partial = messages_reorder.slice(messages_reorder.length-5,messages_reorder.length);
  }
  else  {
    var messages_partial = messages_reorder;
  }
  $scope.messages = messages_partial;
  $scope.community = community;
};


loadMemberInfo( $stateParams.userId )
  .then( getConversationFrom )
  .then( getConversationTo )
  .then( orderFullConversation );

更多详情here

答案 1 :(得分:0)

您可以使用角度$ q service

答案 2 :(得分:0)

您应该查看Angular Promise API。它的目的是为了同一目的。它允许你一个接一个地链接ajax调用..

    // this
    $http.get('/api/v1/movies/avengers')
      .success(function(data, status, headers, config) {
         $scope.movieContent = data;
      });

    // is the same as
    var promise = $http.get('/api/v1/movies/avengers');

    promise.then(
      function(payload) {
        $scope.movieContent = payload.data;
      });

更多详情here