手动自举角应用程序前调用服务方法 [英] Calling service method before manually bootstrapping Angular app

问题描述

我已经通过<读href=\"http://stackoverflow.com/questions/19909009/access-angular-service-when-manually-bootstrapping-initializing\">this问答，但不认为这是解决我的问题。

I have read through this question and answer but don't believe that it is the solution to my problem.

我有我需要加载该应用之前，当前登录用户的详细信息的应用程序。这似乎是非常相似的<一href=\"http://stackoverflow.com/questions/30339582/angularjs-manually-bootstrap-after-receive-data\">this问题但不同的是，我想使用已经存在于我的的AuthenticationService 自举程序之前的方法，并缓存结果该服务。

I have an app in which I require the currently logged-in user's details before loading up the app. This appears to be very similar to this question but the difference is that I want to use a method that already exists in my authenticationService before bootstrapping the app, and cache the result in that service.

app.bootstrap.js

(function(){
    'use strict';

    fetchUser()
        .then(bootstrapApplication);

    function fetchUser() {
        var injector = angular.injector(['app']);
        var authenticationService = injector.get('authenticationService');

        return authenticationService.getUser().then(function(response) {
          // Got user successfully, user is now cached in authenticationService.user
          console.log(response.data);
        });
    }

    function bootstrapApplication() {
        angular.element(document).ready(function() {
          angular.bootstrap(document, ['app']);
      });
    }

})();

我可以调用该服务的方法很好，但是当我引导的应用程序和服务的一个新实例被创建，作为一个结果，问题就来了，我从HTTP请求缓存的数据是在的不同实例服务。

I can call that service method fine, but the problem comes when I bootstrap the app and a new instance of that service is created and, as a result, the data I cached from the HTTP request is in a different instance of the service.

authentication.service.js

(function(){
    'use strict';

    angular
        .module('app.authentication')
        .factory('authenticationService', authenticationService);

    authenticationService.$inject = ['$http', '$cookies', '$log', '$q', 'API_SETTINGS', '_'];

    function authenticationService($http, $cookies, $log, $q, API_SETTINGS, _) {
        var factory = {
            user          : {},
            login         : login,
            logout        : logout,
            getUser       : getUser,
            isLoggedIn    : isLoggedIn,
            getSessionId  : getSessionId
        };

        return factory;

        function getUser() {
            return $http.get(API_SETTINGS.url + '/account', { 
                params: { 
                    'api_key'     : API_SETTINGS.key,
                    'session_id'  : $cookies.get('sessionId')
                }})
            .then(function(response) {
                // Great, cache the user and return the response
                factory.user = response.data;
                return response;
            });
        }

    }

})();

反正我有可以使用的同一个实例我的的AuthenticationService 来使自举前后HTTP调用？还是有别的选择吗？

Is there anyway I can use the same instance of my authenticationService to make the HTTP call before bootstrapping and after? Or is there an alternative?

有一件事情我已经考虑是连接用户在 fetchUser 成功回调窗口让我的AuthenticationService 我可以设置 factory.user = $ window.user || {} ，但我preFER不要做这种方式。

One thing I have considered is attaching the user to the window in the fetchUser success callback so that in my authenticationService I can set factory.user = $window.user || {}, but i'd prefer not to do it this way.

推荐答案

您可以从周围的其他方法处理这个 - 让你的角应用引导和公正的prevent你的用户界面，直到安全服务初始化做任何事情。

You can approach this from the other way around - let your Angular application bootstrap and just prevent your UI to do anything until the security service is initialized.

//~ ...

/**
 * Make UI Router wait.
 */
config(function($urlRouterProvider) {
    $urlRouterProvider.deferIntercept();
}).

/**
 * Initialize security and then activate UI Router.
 */
run(function($urlRouter, securityManager) {
    securityManager.init().then(function() {
        $urlRouter.sync();
        $urlRouter.listen();
    });
}).

//~ ...

这篇关于手动自举角应用程序前调用服务方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！