L'initialisation d'AngularJS service de l'usine de style

J'ai un service qui récupère les données via REST. Je veux stocker les données obtenues dans le niveau de service variable pour une utilisation dans de multiples contrôleurs. Quand j'ai mis tout le RESTE de la logique directement dans les contrôleurs tout fonctionne bien, mais lorsque je tente de déplacer la récupération /stockage de données dans un service le contrôleur n'est pas mis à jour lorsque les données proviennent de retour. J'ai essayé beaucoup de différentes façons de maintenir la liaison entre le service et le contrôleur.

Contrôleur:

myApp.controller('SiteConfigCtrl', ['$scope', '$rootScope', '$route',  'SiteConfigService',
function ($scope, $rootScope, $route, SiteConfigService) {

    $scope.init = function() {
        console.log("SiteConfigCtrl init");
        $scope.site = SiteConfigService.getConfig();
    }

}

]);

Service:

 myApp.factory('SiteConfigService', ['$http', '$rootScope', '$timeout', 'RESTService',
 function ($http, $rootScope, $timeout, RESTService) {

    var siteConfig = {} ;

    RESTService.get("https://domain/incentiveconfig", function(data) {
        siteConfig = data;
    });

    return {

        getConfig:function () {
            console.debug("SiteConfigService getConfig:");
            console.debug(siteConfig);

            return siteConfig;
        }

     };
 }
]);

Vue:

<div class="span4" ng-controller="SiteConfigCtrl">
            <header>
                <h2>
                    {{site.title}}
                </h2>
            </header>

probablement parce que votre service est de retour que vous une promesse et vous devez les utiliser "puis" fonction de votre contrôleur? Voir ici pour plus de détails. johnmunsch.com/2013/07/17/angularjs-services-and-promises
Je suppose que c'est la question. Comment puis-je lier dynamiquement un contrôleur à un service lorsque le service récupère ses données de manière asynchrone? Je ne veux faire de l'appel RESTE une fois et utilisez la copie locale de la session, une fois extraites.

OriginalL'auteur wisemanIV | 2013-10-28

Je voudrais écrire avec la promesse d'usine:

myApp.factory('SiteConfigService', ['$http', '$rootScope', '$timeout', 'RESTService', '$q'
 function ($http, $rootScope, $timeout, RESTService, $q) {

    var siteConfig = {} ;

    RESTService.get("https://domain/incentiveconfig", function(data) {
        siteConfig = data;
    });

  //or just 
  //var siteConfig = RESTService.get("https://domain/incentiveconfig");

    return {

        getConfig:function () {
             var deferred = $q.defer();
             deferred.resolve(siteConfig);

              return deferred.promise;    
        }

     };
 }
]);

Contrôleur de côté

         SiteConfigService.getConfig()
                    .then(function (result) {
                       $scope.site = result;                           
                    }, function (result) {
                        alert("Error: No data returned");
                    });

Je n'ai pas de violon/plunker, mais espérons que cet exemple peut vous aider: jsfiddle.net/9Ymvt/674
J'ai ce travail. J'ai eu à faire des mods pour le code ci-dessus. Je vais poster la réponse complète de temps en temps.

OriginalL'auteur Maxim Shoustin

Solution basée sur la Maxime de la réponse ci-dessus - JsFiddle - http://jsfiddle.net/acb98sm/2pQ6A/6/

var myApp = angular.module('myApp',[]);
myApp.controller('SiteConfigCtrl', ['$scope', '$rootScope', '$route', 'SiteConfigService', 
function ($scope, $rootScope, $route, SiteConfigService) {
SiteConfigService.getConfig()
.then(function (result) {
console.log("results are in ");
console.log(result); 
$scope.site = result.data; 
}, function (result) {
alert("Error: No data returned");
});
}
]);
myApp.factory('SiteConfigService', ['$http', '$rootScope', '$timeout', 'RESTService', '$q',
function ($http, $rootScope, $timeout, RESTService, $q) {
var siteConfigFn = RESTService.get("http://graph.facebook.com/616366118/",    function(data) {
console.log("SiteConfigService returns");
});
return {
getConfig:function () {
var deferred = $q.defer();
deferred.resolve(siteConfigFn);
return deferred.promise;    
}
};
}
]);
myApp.$inject = ['$scope', 'SiteConfigService', 'RESTService'];
myApp.factory('RESTService',
function ($http) {
return {
get:function (url, callback) {
return $http.get(url, {withCredentials:false}).
success(function (data, status, headers, config) {
callback(data);
}).
error(function (data, status, headers, config) {
console.log("failed to retrieve data");
});
},
post:function (url, data, callback) {
return $http.post(url, data, {withCredentials:true}).
success(function (data, status, headers, config) {
callback(data);
}).
error(function (data, status, headers, config) {
console.log("failed to retrieve data");
});
}
};
}
);

OriginalL'auteur wisemanIV

Vous devez vous connecter pour publier un commentaire.