9

Preciso fazer requisições, porém a primeira deve ser um GET (getByNome) e depois executar o resto pois dependem dessa. Acontece que o meu código está enviando um undefined pois as requisições dependem de contatosUri que é definido nesta primeira requisição GET.

Pela ordem dos alerts, o sucesso da requisição get acontece por último e são feitos os outros requests. Como faço uma "requisição síncrona" para garantir que somente após executar o getByNome irá executar o resto?

$scope.salvar = function () {
    alert("Buscando uri de agencia....");
    var contatosUri = [];
      for(var j = 0; j < $scope.contatos.length; j++){
        var nomeAgencia = $scope.contatos[j].agencia;
        agenciasAPI.getByNome(nomeAgencia).success(function (data){
            alert("Inserir no array.. " + data._links.self.href);
            contatosUri.push(data._links.self.href);
        }).catch(function (error){
          alert(JSON.stringify(error) + "\t" + error);
        });
      }
    alert("Foi inserido no array...." + contatosUri[0]);

    alert("Requests de veiculo...");
    //BUSCAR URI DE AGENCIA
    function buscarAgenciaUri(vetorDados) {
      try {
        var agenciasUri = [];
        for (var i = 0; i < $scope.listaAgencias.length; i++) {
          var json = $scope.listaAgencias[i];
          for (var k = 0; k < vetorDados.length; k++) {
            if (json.nome == vetorDados[k]) {
              agenciasUri.push(json._links.self.href);
            }
          }
        }
      } catch (err) {
        alert(err);
      }
      return agenciasUri;
    }

     var agenciasSeparadas = $scope.opcoes + '';
     agenciasSeparadas = agenciasSeparadas.split(',');
     var agenciasUri = buscarAgenciaUri(agenciasSeparadas);

     //ENVIAR DADOS DE VEICULO
     var jsonObj = {
       nome: $scope.nome,
       tipo: $scope.tipo,
       agencias: agenciasUri,
       contatos: contatosUri
     };

     alert("Enviar json de veiculo..." +JSON.stringify(jsonObj));
     veiculosAPI.postVeiculo(jsonObj)
     .success(function (data, status, headers, config) {
       $scope.nome = null;
       $scope.tipo = null;
     }).error(function (data, status, headers) {
       alert("Erro ao salvar dados do veiculo!");
       alert(data + "\t" + JSON.stringify(data));
     });

  }; 

2 Respostas 2

5

Como o JavaScript é "single thread", ele foi feito para ser assíncrono. Caso contrário, ele iria travar o navegador se sua requisição síncrona demorasse muito e iria exibir aquela mensagem chata para o usuário, pedindo para que ele parasse o Script e assim interrompendo a execução da sua aplicação.

Para realizar requisições de modo "síncrono" você utilizar promises. No angular, você pode utilizar o Service $q.

Uma requisição $http angular utilizando promises se resume a:

function asyncGET(url) {
    var deferred = $q.defer();
    $http.get(URL).success(function(data,status,headers,config) {
        deferred.resolve(data);
    })
    .error(function(data,status,headers,config){
        deferred.reject(status);
    });

    deferred.promise.then(function(resolve){
        return resolve;
    }, function(reject){
        alert('Erro: ' + reject);
    });
}

PS: não esquecer de adicionar o $q aos serviços do controller.

5
  • pt.stackoverflow.com/questions/48011/… Aproveitando essa pergunta que vi, isso é uma boa solução? Forçar ser síncrono ou tem outra coisa que eu possa fazer? Commented 23/07/2015 às 17:17
  • Sim. Você não está forçando uma requisição síncrona. Você está criando uma promessa de que ali existirá um valor. É como se vc fosse organizando sua queue e executando as ações que dependem daquela promessa assim que elas forem cumpridas. A sua página irá carregar assincronamente e os valores dependentes das promessas irão aparecendo depois. Uma promise representa um valor pendente. Você pode ler um pouco sobre promises nesse link: mullie.eu/how-javascript-promises-work
    – RafaelTSCS
    Commented 23/07/2015 às 17:25
  • E ai? Resolveu?
    – RafaelTSCS
    Commented 24/07/2015 às 20:55
  • Sim, na solução do problema foi essencial a sua resposta e do OnoSendai Commented 27/07/2015 às 12:07
  • Promisses não são síncronos, são assíncronos.
    – danilo
    Commented 2/07/2019 às 13:44
5

Via Angular você pode fazer uso de chained promises:

$http.get('http://server.com/endpoint1')
.then(function(response) {
    //seus dados obtidos em http://server.com/endpoint1
    //   estarão em response.data.
    return $http.get('http://server.com/endpoint2');
})
.then(function(response) {
    //seus dados obtidos em http://server.com/endpoint2
    //   estarão em response.data.
    return $http.get('http://server.com/endpoint3');
})
.then(function(response) {
    //seus dados obtidos em http://server.com/endpoint3
    //   estarão em response.data.

    //Adicione seu tratamento final aqui.
});

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .