Angular JS中的GET方法在配置后运行

Angular JS Method GET inside RUN after CONFIG

本文关键字：配置 运行 方法 JS 中的 GET Angular      更新时间：2023-09-26

我需要在RUN方法内执行一个请求以从api检索用户数据。首页(首页)，取决于用户数据。

这是我的控制台中调度的顺序:


配置运行
INIT GET USER DATA
侧边栏
家
成功获取用户数据

我的问题是，我需要等待用户数据之前调用侧边栏和主页(控制器和视图)，我不知道我怎么能做到这一点。

更新

我现在有这个了:

我的配置:

    extranet.config(['$httpProvider', '$routeProvider', function ($httpProvider, $routeProvider) {
         // My ROUTE CONFIG
         console.log('CONFIG');
    }]);

我的运行:

    extranet.run(function($rootScope, $location, $http, Cookie, Auth, Session) {
        console.log('RUN');
        var token = Cookie.get('token');
        // The login is done
        var success = function (data) {
            Session.create(data);
            console.log('USER DATA SUCCESS');
        };
        var error = function () {
            $location.path('/login');
        };
        // GET USER DATA
        Auth.isAuthenticated().success(success).error(error);
    });

MY CONTROLLER MAIN:

    extranet.controller('MainCtrl', function ($scope, $location) {
        console.log('MAIN CONTROLLER');
    });

使用解析器

extranet.config(['$httpProvider', '$routeProvider', function ($httpProvider, $routeProvider) {
         // My ROUTE CONFIG
         $routeProvider.when('/', {
                   templateUrl: "/app/templates/sidebar.html",
                   controller: "siderbarController",
                   title: "EventList",
                   resolve: {
                        events: function ($q, Cookie,Session) {
                             var deffered = $q.defer();
                             Cookie.get('token').$promise
                                   .then(function (events) {
                                        Session.create(data);
                                        console.log('USER DATA SUCCESS');
                                        deffered.resolve(events);
                                     }, function (status) {
                                         deffered.reject(status);
                                    });
                                return deffered.promise;
                        }
                   }
    }]);

如果你使用AngularJS方法来处理服务器请求，你会得到一个承诺。一旦收到响应，承诺就会得到解决。所有定义的回调函数都"等待"直到解析。

天真的解决方案

所以，如果你有一个类似rest的后端，你将使用$http甚至$resource:

var promise = $http.get(userDataUrl, params)
$rootScope.userDataPromise = promise;

之后，你可以在任何需要数据的地方使用该承诺:

$rootScope.userDataPromise.then(myCallback)

更好的解决方案

使用$rootScope用于此目的并不是一个优雅的解决方案。你应该把Userdata的东西封装在一个服务中，并在你需要的地方注入它。

app.factory('UserData', ['$http',
    function($http) {
        var fetch = function() {
            return $http.get(userDataUrl, params)
        };
        return {
            fetch: fetch
        };
    }
]);

现在你可以在其他模块中使用该服务:

app.controller('MainCtrl', ['$scope', 'UserService',
    function ($scope, UserService) {
        var update = function(response) {
            $scope.userData = response.userData;
        }
        var promise = UserService.fetch();
        promise.then(update)
    }
);

相关文章：