Ajaxを使用していくつかのサーバーデータをフェッチし、それ$rootScope
をコントローラーとサービスがアプリをブートストラップする前に取得できるようにアタッチするアプリケーションをリファクタリングしようとしています。$q
plnkr: http://plnkr.co/edit/22yQUlyE9nbQ0WVjxWxY
そのplnkrで、いくつかのコントローラーが動作するようにサービスにデータを返させようとしています。
app.service('data', function($q, $window, $timeout) {
var promise = $q.defer();
promise.promise.foo = 'Dang!';
$timeout(function() {
console.log('resolve promise');
promise.resolve({
foo: 'bar',
baz: 'zot'
});
}, 1000);
console.log('return promise');
return promise.promise
});
$routeProvider の resolve-property をこのように使用しています
app.config(function($routeProvider) {
$routeProvider.when('/', {
controller: 'MainController',
templateUrl: 'data.html',
resolve: {
data: 'data'
}
});
});
しかし、解決されたプロミスの 'foo' プロパティをコントローラーの 1 つで $scope に割り当てようとすると、うまくいきません。
app.controller('MainController', function($scope, data) {
$scope.main = data.foo;
});
app.controller('Controller1', function($scope, data) {
$scope.controller1 = data;
});
http://plnkr.co/edit/22yQUlyE9nbQ0WVjxWxY?p=previewで見られるように、Promise が解決され、実際の Promise オブジェクトのプロパティが終了した$scope
ときに、 は更新されません。foo
$scope
それで、約束のプロパティをに割り当てることによって、ここで絶対にやってはいけないことをしています$scope
か? ルートの解決プロパティは、約束が解決されるまで何も初期化されないことを意味するという印象を受けました。