How to work with AngularJS $ http service in a synchronous way?
In this case I am using AngularJS + Laravel and 3 tables to save a questionnaire (in which an evaluation has several questions, and each question has several items):
-
evaluations (id, user_id, project_id, processed);
Note: the backend (laravel) works perfectly in single tests, but when I put the $ http.post inside the for does not save all the items of the questions and not all the questions ... and then it returns the error several times:
POST http://localhost:8000/teste/api/avaliation_question/create
XMLHttpRequest cannot load http://localhost:8000/teste/api/avaliation_question/create. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://teste.localhost' is therefore not allowed access. The response had HTTP status code 401.
My code (excerpt from the controller where you have $http.post ):
$scope.save = function () {
// table avaliations
$scope.avaliations.user_id = $scope.currentUser.id;
$scope.avaliations.user_valuer_id = $scope.valuer.id;
$scope.avaliations.project_id = $scope.project.id;
$scope.avaliations.processed = 0;
$scope.avaliations.send = 0;
// begin save avaliations ----------------------------------------------
$http.post(ApiUrl.api_url + "/api/avaliation/create", $scope.avaliations).
success(function (data, status) {
if (status == 200) {
// coloca o id da questao e o id da avaliacao
for (var question in $scope.avaliation_questions) {
$scope.avaliation_questions[question].avaliation_id = data.id;
$scope.avaliation_questions[question].question_id = question;
// begin save avaliation_questions -------------------------
$http.post(ApiUrl.api_url + "/api/avaliation_question/create", $scope.avaliation_questions[question]).
success(function (data, status) {
if (status == 200) {
// coloca o id do item do questionario
for (var item in $scope.avaliation_question_items[question]) {
$scope.avaliation_question_items[question][item].avaliation_question_id = data.id;
$scope.avaliation_question_items[question][item].question_items_id = item;
// begin save avaliation_question_items --------
$http.post(ApiUrl.api_url + "/api/avaliation_question_item/create", $scope.avaliation_question_items[question][item]).
success(function (data, status) {
if (status == 200) {
$scope.toaster = {
type: 'success',
title: 'Avaliação',
text: 'Avaliação salva com sucesso!'
};
toaster.pop($scope.toaster.type, $scope.toaster.title, $scope.toaster.text);
} else {
$scope.toaster = {
type: 'error',
title: 'Itens da questão',
text: 'Erro encontrado ao salvar este item: status - ' + status
};
toaster.pop($scope.toaster.type, $scope.toaster.title, $scope.toaster.text);
}
}).
error(function (data, status) {
$scope.toaster = {
type: 'error',
title: 'Itens da questão',
text: 'Erro de sistema'
};
toaster.pop($scope.toaster.type, $scope.toaster.title, $scope.toaster.text);
});
// end save avaliation_question_items ----------
}
} else {
$scope.toaster = {
type: 'error',
title: 'Questões da avaliação',
text: 'Erro encontrado ao salvar esta questão: status - ' + status
};
toaster.pop($scope.toaster.type, $scope.toaster.title, $scope.toaster.text);
}
}).
error(function (data, status) {
$scope.toaster = {
type: 'error',
title: 'Questões da avaliação',
text: 'Erro de sistema'
};
toaster.pop($scope.toaster.type, $scope.toaster.title, $scope.toaster.text);
});
// end save avaliation_questions ---------------------------
}
} else {
$scope.toaster = {
type: 'error',
title: 'Avaliação',
text: 'Erro encontrado ao salvar esta avaliação: status - ' + status
};
toaster.pop($scope.toaster.type, $scope.toaster.title, $scope.toaster.text);
}
}).
error(function (data, status) {
$scope.toaster = {
type: 'error',
title: 'Avaliação',
text: 'Erro de sistema'
};
toaster.pop($scope.toaster.type, $scope.toaster.title, $scope.toaster.text);
});
// end save avaliations ------------------------------------------------
};