angular.js - angularjs data transmission problem

Question

Is there any way to get some data from the server before loading the controller? So that the value can be guaranteed in the controller? (Big head, black line...)

A factory gData is defined as follows

angular.module('myapp', ['user'])
    .factory('gData', function ($http) {
            //$rootScope该怎么用？？？？
            var data = {
                userInfo:{}
            };
                $http.get('user/getProfile', {})
                    .then(function (r) {
                        console.log(r.data); //这是console1
                        if(r.data.status == 1) {
                            data.userInfo.userId = r.data.data['user'].id;
                            data.userInfo.name = r.data.data['user'].name;
                            data.userInfo.group_id = r.data.data['user'].groups[0].id;
                            data.userInfo.supervisor_id = r.data.data['user'].groups[0].supervisor_id;
                        }
                    });
            console.log(data);//这是console2
            return data;
        })

    由于异步加载，console2先于1执行，所以返回的空值。

//请假条controller，user model中
       .controller('AskforLeaveController', [
           '$scope',
           'UserService',
           '$filter',
           'gData',
           function ($scope, UserService,$filter,gData) {
           
               console.log(gData.userInfo); //有值
               console.log(gData.userInfo.userId);//undefind
               
                UserService.askLeaveInfo.user_id = gData.userInfo.userId; //失败，undefind！！！！how can I do
              UserService.askLeaveInfo.supervisor_id = gData.userInfo.supervisor_id; //失败，undefind
              
              //...

Please tell me, how to deal with it? ? ? (Crying) I’ve been doing this for two days using various methods

There is another problem. The $rootScope defined under myapp in the controller under user actually prompts me to unfind...

Answer 1

Um... like this? have a try, my first instinct, I don’t know what to do = = Program for intuition, don’t blame me if you are wrong

 $http.get('user/getProfile', {})
                    .then(function (r) {
                        console.log(r.data); //这是console1
                        if(r.data.status == 1) {
                            data.userInfo.userId = r.data.data['user'].id;
                            data.userInfo.name = r.data.data['user'].name;
                            data.userInfo.group_id = r.data.data['user'].groups[0].id;
                            data.userInfo.supervisor_id = r.data.data['user'].groups[0].supervisor_id;
                        }.then(function(){
                        console.log(data);//这是console2
                        return data;
                        })
                    });
            

Answer 2

Um, that’s normal.

Returnpromise对象，不要返回data，直接return $http.get(xxx);

Directly when calling factory later.

factory.func().then(data) {
    //你的逻辑
}

Unconventional idea, I have done it before...

1. Give a callback method parameter in the factory. After the request is completed, call the callback and put userInfoin ​​the parameter.

2. Add a $watch and process it after there is a value (change will trigger, remember to check if it is not empty, it seems that watch will also be triggered during initialization). Remember to delete the watch after processing. It will return to var unwatch = $watch()的方法，直接unwatch(); and execute after calling.

3. Send events (should not work in factory)? .

Answer 3

I don’t know if you know promise?
$http.get() method will return a promise. If you don’t understand promise, please google it first
The following is an idea:

angular.module('myapp', ['user'])
    //创建service
    .service('user.service', function($http,$q) {
        var userInfo = null;
        return {
            getUserInfo: function () {
                return $q(function (resolve) {
                    if (userInfo) {
                        resolve(userInfo);
                    }else {
                        $http.get('/user/getProfile', {}).then(function (resp) {
                            userInfo = {
                                userId:resp.data.user.id,
                                name:resp.data.user.name,
                                group_id:resp.data.groups[0].id,
                                supervisor_id:resp.data.groups[0].supervisor_id,
                            };
                            resolve(userInfo);
                        });
                    }
                });
            }
        };
    })
    //使用这个service
    .controller('xxx',['user.service',function (service) {
        service.getUserInfo().then(function (userInfo) {
            console.log(userInfo);
        });
    }]);