私はangularjsを初めて使用します。私の目標はとてもシンプルです。データを取得するためにajax呼び出しを行い、完了したら、最初のセットの情報に依存する別のデータセットを取得するために2番目の呼び出しを行いたいと思います。
ネストされたajax呼び出しの代わりにチェーンを利用できるように、また必要に応じて結び付けることができる独立した関数を持つ機能をより適切に保持できるように、promiseメカニズムを利用してこれを実行しようとしています。
私のコードは次のようになります。
var promiseGetWorkTypes = function ($q, $scope, $http) {
console.log("promiseGetWorkTypes");
return $q(function (resolve, reject) {
$http({
method: 'GET',
url: '/WorkTypes'
}).then(
function (payload) {
console.log("Got workttypegroups")
console.log(payload);
$scope.WorkTypeGroups = payload.data;
console.log("End of worktypegroups");
resolve(payload);
},
function (payload) {
reject(payload);
});
});
};
var promiseGetRecentActivities = function ($q, $scope, $http) {
console.log("promiseGetRecentActivities");
return $q(function (resolve, reject) {
$http({
method: 'GET',
url: '/RecentHistory'
}).then(
function (payload) {
$scope.RecentActivities = payload.data;
resolve(payload);
},
// data contains the response
// status is the HTTP status
// headers is the header getter function
// config is the object that was used to create the HTTP request
function (payload) {
reject(payload);
});
});
};
var index = angular.module("index", []);
index
.controller('EntitiesController', function ($scope, $http, $timeout, $q) {
promiseGetWorkTypes($q, $http, $scope)
.then(promiseGetRecentActivities($q, $http, $scope));
}ただし、デバッグコンソールを見ると、「promiseGetRecentActivities」の呼び出しが、「promiseGetWorkTypes」のAjax処理が発生する前に開始されていることがわかります。
私はここで何が欠けているか、間違っているのですか？
あなたが書くとき
promiseGetWorkTypes($q, $http, $scope).then(promiseGetRecentActivities($q, $http, $scope));
これpromiseGetActivitesは、この行が評価されるときに呼び出されます。呼び出しをpromiseGetActivities別の関数でラップして、最初のpromiseが解決されて呼び出しが順番に実行されるまで、呼び出しを遅らせることができるはずです。
promiseGetWorkTypes($q, $http, $scope).then(function() {
promiseGetRecentActivities($q, $http, $scope);
});
その理由はthen、内部で何が起こっているかとは関係ありませんが、Javascript構文によるものです。以下：
myFunc1(myFunc2());
myFunc1に渡す結果、呼び出しのmyFunc2()といないの参照myFunc2機能を。したがって、論理的にmyFunc2は、の前に実行する必要がありますmyFunc1。あなたが書いた場合
myFunc1(myFunc2);
次にmyFunc1、への参照を受け取るmyFunc2ので、myFunc1前に実行されますmyFunc2（実際、それを呼び出すコードがmyFunc2内部のどこかにmyFunc1ある場合にのみ実行されます）。
関数をインライン/匿名で定義しても、この動作は変わりません。匿名関数の結果を別の関数に渡すには、次のようにします。
myFunc1((function() {
return 'something';
})());
匿名関数を最初に評価し、その戻り値として'something'に渡されmyFunc1ます。匿名関数への参照を渡すには、次のようにします。
myFunc1(function() {
return 'something';
});
そして、myFunc1渡された関数を呼び出すかどうかによって決まります。
それをあなたの質問、あなたのコードに戻してください：
promiseGetWorkTypes($q, $http, $scope).then(promiseGetRecentActivities($q, $http, $scope));
はの結果をpromiseGetRecentActivities($q, $http, $scope)に渡すthenので、実行する前に実行する必要があります。thenしたがって、promisepromiseGetWorkTypesが解決されるのを確実に待ちません。あなたが望んでいるように見えるのは、呼び出されたときに実行される関数を渡すことpromiseGetRecentActivities($q, $http, $scope)です。
promiseGetWorkTypes($q, $http, $scope).then(function() {
promiseGetRecentActivities($q, $http, $scope);
});
します。
ちなみに$q、$httpさまざまな機能に渡すなど、少し変わった/複雑すぎるように見えますが、おそらくこの質問の範囲を超えて代替案を検討すると思います。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加