私のアプリにはいくつかのビューがあり、各ビューにはコントローラーがあります。
標準の JSON 配列を返す API リソースがいくつかあります。ビューが変更されるたびに、リソースは新しいデータに対して再クエリされますが、かなり遅いです。毎回再クエリを実行せずに、コントローラに API リソースを提供したいと考えています。
これを行う最良の方法は何ですか?
私のアプリにはいくつかのビューがあり、各ビューにはコントローラーがあります。
標準の JSON 配列を返す API リソースがいくつかあります。ビューが変更されるたびに、リソースは新しいデータに対して再クエリされますが、かなり遅いです。毎回再クエリを実行せずに、コントローラに API リソースを提供したいと考えています。
これを行う最良の方法は何ですか?
私の理解が正しければ、これがサービスの目的です。それらは、コントローラーがデータを共有するための中心的な場所のようなものです。
このチュートリアルで使用されているコードの jsfiddle を調べました。
http://onehungrymind.com/angularjs-communicating-between-controllers/
var myModule = angular.module('myModule', []);
myModule.factory('mySharedService', function($rootScope) {
var sharedService = {};
sharedService.message = '';
sharedService.prepForBroadcast = function(msg) {
this.message = msg;
this.broadcastItem();
};
sharedService.broadcastItem = function() {
$rootScope.$broadcast('handleBroadcast');
};
return sharedService;
});
function ControllerZero($scope, sharedService) {
$scope.handleClick = function(msg) {
sharedService.prepForBroadcast(msg);
};
$scope.$on('handleBroadcast', function() {
$scope.message = sharedService.message;
});
}
function ControllerOne($scope, sharedService) {
$scope.$on('handleBroadcast', function() {
$scope.message = 'ONE: ' + sharedService.message;
});
}
function ControllerTwo($scope, sharedService) {
$scope.$on('handleBroadcast', function() {
$scope.message = 'TWO: ' + sharedService.message;
});
}
ControllerZero.$inject = ['$scope', 'mySharedService'];
ControllerOne.$inject = ['$scope', 'mySharedService'];
ControllerTwo.$inject = ['$scope', 'mySharedService'];
編集
リソース呼び出しについては、現在、このように使用するサービスがあります。申し訳ありませんが、それはcoffeescriptにあります
.factory('EventService', (SubEvent, User) ->
subevents = {}
return {
getSubevent: (subevent_id) ->
SubEvent.get {subevent_id: subevent_id}, (subevent) ->
participants = (participant.user for participant in subevent.participants)
User.query {participants: participants}, (users) ->
for user,i in users
subevent.participants[i].user = user
subevents[subevent_id] = subevent
}
)