/ / Odkładaj i obiecuj, że angularjs nie działa poprawnie - javascript, jquery, angularjs

Odkładaj i obiecuj, że angularjs nie działa poprawnie - javascript, jquery, angularjs

Mam teraz problem z defer promise w angularjs.

Oto mój kod:

var defer = $q.defer();

defer.promise
//First Execution
.then(function () {
TestService.GetSchoolYear().then(function (results) {
$scope.schoolYears = results.data;
$scope.schoolYear = results.data[0].schlYearName;
});
})
//Second Execution
.then(function () {
TestService.GetAffiliation().then(function (results) {
$scope.affiliation = results.data;
$scope.school = results.data[0].affiliation;
});
})
//Third Execution
.then(function () {
TestService.GetDepartment().then(function (results) {
$scope.departments = results.data;
$scope.department = results.data[0].depName;
$scope.depCode = results.data[0].depCode;
});
})
//Fourth Execution
.then(function () {
TestService.GetYearLevel2($scope.depCode).then(function (results) {
$scope.yearLevels2 = results.data;
$scope.yearLevel2 = results.data[0].yearName;
});
});
defer.resolve();

Cała realizacja jest w porządku. Ale odroczenie wykonania w innej funkcji nie w kolejności.

Co jest nie tak z moim kodem? Czy jest z tym jakiś problem?

Mam to odniesienie tutaj: https://thinkster.io/egghead/promises/

Czy brakuje mi czegoś w kodzie. Wszystko, czego chcę, to wykonanie funkcji w kolejności, ponieważ w innej funkcji są wymagane dane.

Dziękuję Ci.

Odpowiedzi:

1 dla odpowiedzi № 1

Ponieważ różne funkcje TestService wydają się zwracać obietnicę, nawet nie potrzebujesz $q.defer tutaj - w rzeczywistości byłoby to opóźniony anty-wzór.

Po prostu połącz je razem i return wynik:

return TestService.GetSchoolYear()
.then(function (results) {
$scope.schoolYears = results.data;
$scope.schoolYear = results.data[0].schlYearName;

return TestService.GetAffiliation();
})
.then(function (results) {
$scope.affiliation = results.data;
$scope.school = results.data[0].affiliation;

return TestService.GetDepartment();
})
.then(function (results) {
$scope.departments = results.data;
$scope.department = results.data[0].depName;
$scope.depCode = results.data[0].depCode;

return TestService.GetYearLevel2($scope.depCode);
})
.then(function (results) {
$scope.yearLevels2 = results.data;
$scope.yearLevel2 = results.data[0].yearName;
return results;
});

0 dla odpowiedzi nr 2

Aby łańcuch obietnicy działał then funkcja powinna coś zwrócić.

Spróbuj tego:

defer.promise
//First Execution
.then(function () {
return TestService.GetSchoolYear().then(function (results) {
$scope.schoolYears = results.data;
$scope.schoolYear = results.data[0].schlYearName;
return results;
});
})
//Second Execution
.then(function () {
return TestService.GetAffiliation().then(function (results) {
$scope.affiliation = results.data;
$scope.school = results.data[0].affiliation;
return results;
});
})
//Third Execution
.then(function () {
return TestService.GetDepartment().then(function (results) {
$scope.departments = results.data;
$scope.department = results.data[0].depName;
$scope.depCode = results.data[0].depCode;
return result;
});
})
//Fourth Execution
.then(function () {
return TestService.GetYearLevel2($scope.depCode).then(function (results) {
$scope.yearLevels2 = results.data;
$scope.yearLevel2 = results.data[0].yearName;
return results;
});
});
defer.resolve();

0 dla odpowiedzi № 3

Nic nie zwracasz then obsługi, więc obietnice stworzone przez then() metody rozwiązują się natychmiast i przechodzą do następnego then() natychmiast.

Musisz zwrócić obietnicę, aby było na co czekać:

.then(function () {
// v--------  here
return TestService.GetSchoolYear().then(function (results) {
$scope.schoolYears = results.data;
$scope.schoolYear = results.data[0].schlYearName;
});
})

Należy również zauważyć, że nie ma potrzeby używania $q.defer() tutaj (prawie nigdy nie ma powodu do używania $q.defer().

Możesz po prostu użyć $q.when():

 $q.when()
.then(function () {
// ....
})

Lub jeszcze lepiej, po prostu zacznij swój łańcuch obietnic od pierwszego wywołania asynchronicznego, które wykonujesz:

TestService.GetSchoolYear().then(function (results) {
$scope.schoolYears = results.data;
$scope.schoolYear = results.data[0].schlYearName;
})
.then(function () {
return TestService.GetAffiliation().then(function (results) {
// ...
});
})  // ...