への呼び出し$http()
(または$http.get()
etc などのエイリアスのいずれか) は、すぐに Web 要求を呼び出します (インスペクターまたはサードパーティ コンポーネントによる操作を禁止します)。これは、jQuery などの他のフレームワークで XmlHttpRequest または JSONP リクエストを発行することに似ています。
サービスはシングルトンとして作成されるため、最初に要求されたときに一度作成され、その時点から同じインスタンスが注入されます。サービスが何をするかは完全にあなた次第です.
長期間実行され、データで更新する必要があるアプリケーションがある場合は、適切に設計する必要があります。明らかに、私はあなたの仕様の完全な要件や詳細を知りませんが、うまくいくようにいくつかのヒントを与えることができます.
大まかに言えば、(サービスを使用して) タイマーで動作する関数が必要なように$timeout
思えます。時間枠を満たすか超えた場合は、$http
リクエストを呼び出して最新のデータを取得し、それを必要とするさまざまなコンポーネントにルーティングします。次に、次に動作する時間枠をマークし、タイムアウトを再度設定して、さらに先にウェイクアップし、再び作業を行う時間かどうかを確認できるようにする必要があります。
最初に考えるべきことは、この機能をどこに置くべきかということです。特定のコントローラーでのみ発生する必要がある場合は、 と を使用して、そのコントローラーですべてを実行でき$timeout
ます$http
。一方、このデータを複数の場所で再利用する必要がある場合は、サービスを使用する必要があります。サービスを使用している場合 (その可能性が高い)、変更を必要とするアプリのさまざまな部分に変更を加える最善の方法を見つける必要があります。
私の推奨事項は、リクエストがデータを更新したときにサービスから$rootScope
Angularイベントを使用することです。次に、このデータを使用するさまざまなコントローラー、サービス、およびディレクティブが、このイベントを使用してサブスクライブし、適切に反応することができます。これにより、サービスをそれを使用するものから切り離し、変更に簡単に対応できるようにします。$broadcast
$http
$scope.$on
サービスが行うのは、タイムアウトを設定することだけです。データのチェックに失敗した場合、データがある場合は、イベントでデータをブロードキャストし、$rootScope
別のタイムアウトを設定します。クライアントは、サービスからイベントを受け取ると、ローカル スコープをリッスンして新しいデータで更新するだけです。
このプランクにはばかげた例が含まれています。1 日の時間または適切と思われる時間に作業をスケジュールするように変更し$http
、現在の日付を送信するのではなく、要求を作成するように変更することもできます。
angular.module("demo", [])
.service('myService', ['$rootScope', '$timeout', '$http', function($rootScope, $timeout, $http) {
var state = { timeout: null, next: null };
function work() {
var now = Date.now();
if (now >= state.next) { // you can replace with your own logic to schedule when it should occur (like a specific time of day). in this example, we poll every second, but do work every 5.
// this is where your $http service can do work, something like $http.get(...).success(function(data) { $rootScope.$broadcast('myService.data', data); });
$rootScope.$broadcast('myService.data', new Date());
state.next = now + 5000; // do work every five seconds
}
state.timeout = $timeout(work, 1000); // poll every second
}
return {
start: function() {
if (state.timeout) $timeout.cancel(state.timeout); // cancel pending timeout
work(); // first time will just schedule work to be done in the future
},
stop: function() {
if (state.timeout) $timeout.cancel(state.timeout); // cancel pending timeout
}
};
}])
.controller('DemoCtrl', ['$scope', function($scope) {
$scope.title = "Hello, World";
// here, the controller subscribes to the event, and when it occurs, it copies the event data to a local scope item
$scope.$on('myService.data', function(evt, data) {
$scope.$apply(function() {
$scope.myServiceData = data;
});
});
}])
.run(['myService', function(myService) {
myService.start(); // starts the service when the app runs
}]);