javascript - angular的controller为什么会先于run运行？刷新页面对route的作用机理是什么？

问题描述

问 题

先上console

wangEditor.js:3059 wangEditor提示: 本页面富文本编辑器由 wangEditor 提供 http://wangeditor.github.io/
material-modal.js:19 material-modal.js v1.1
jquery-2.2.3.min.js:4 Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.
wangEditor.js:3059 wangEditor提示: 正在处理 微博表情 表情的数据...
wangEditor.js:3059 wangEditor提示: 建议在配置中自定义百度地图的mapAk，否则可能影响地图功能，文档：http://www.kancloud.cn/wangfu...

custom.js:380 undefined
custom.js:381 undefined
angular.min.js:118 TypeError: Cannot read property 'user' of undefined

at new <anonymous> (http://www.gzmu.net.cn/gzmu_admin/js/custom.js:424:29)
at Object.instantiate (http://www.gzmu.net.cn/gzmu_admin/js/angular.min.js:42:64)
at http://www.gzmu.net.cn/gzmu_admin/js/angular.min.js:90:44
at Object.link (http://www.gzmu.net.cn/gzmu_admin/js/angular-route.min.js:7:278)
at http://www.gzmu.net.cn/gzmu_admin/js/angular.min.js:16:75
at la (http://www.gzmu.net.cn/gzmu_admin/js/angular.min.js:81:602)
at p (http://www.gzmu.net.cn/gzmu_admin/js/angular.min.js:66:349)
at g (http://www.gzmu.net.cn/gzmu_admin/js/angular.min.js:58:489)
at http://www.gzmu.net.cn/gzmu_admin/js/angular.min.js:58:127
at http://www.gzmu.net.cn/gzmu_admin/js/angular.min.js:63:43 <ng-view class="ng-scope">(anonymous function) @ angular.min.js:118(anonymous function) @ angular.min.js:90la @ angular.min.js:81p @ angular.min.js:66g @ angular.min.js:58(anonymous function) @ angular.min.js:58(anonymous function) @ angular.min.js:63d @ angular.min.js:59m @ angular.min.js:64B @ angular-route.min.js:6$broadcast @ angular.min.js:148(anonymous function) @ angular-route.min.js:11(anonymous function) @ angular.min.js:131$eval @ angular.min.js:145$digest @ angular.min.js:142$apply @ angular.min.js:146l @ angular.min.js:97J @ angular.min.js:102t.onload @ angular.min.js:103

custom.js:12 123

我把console整个copy进来了，因为不知道是不是别的什么插件的问题导致的。
主要需要注意的地方就是上面的那些引用块。
custom.js的第12行是run的最后一个语句
而前面的第380行和第381行是controller中的语句，现在可以明显看出，controller先于run运行了，所以导致了controller的出错。
这个项目使用了路由，所以也想问是不是路由的问题？
在别的没有editor插件的页面测试了一下，还是会有这个问题，这个问题一旦刷新就很高机会出现。

补充customjs中的部分代码：

app.run(function ($rootScope,$http) {
    if(!$rootScope.userinfo){
        $http({
            method: 'GET',
            url: 'datacon/user_info.php',

        }).success(function (response) {
            if (response)

                $rootScope.userinfo=response[0];
            console.log($rootScope.userinfo)
        })
    }

});
app.controller('data',function ($scope,$http,$rootScope) {
    $scope.userinfo= new Object();
    $scope.userinfo.user=0;//预设一下避免出错
    $scope.userinfo=$rootScope.userinfo;
    $scope.username=$scope.userinfo.user;
    console.log($scope.userinfo)

});

我更换了controller在文档中的位置，让它修改起来不需要鼠标滚轮滚一晚上才能到。

这是第一次加载页面时候的console

这是刷新之后的console，不管你是第几次刷新，都是有同样的报错。但是如果你刷新的间隔时间长一些（6秒以上大概），这个就不会报错了。

broadcast

app.run(function ($rootScope, $http) {
        $http({
            method: 'GET',
            url: 'datacon/user_info.php',

        }).success(function (response) {
            if (response)
                    $rootScope.userinfo = response[0];
            $rootScope.$broadcast("userinfo", response[0]);
        })
});
app.controller('data', function ($scope, $http, $rootScope) {

    $scope.$on("userinfo",
      function (event, msg) {
           console.log("childCtr2", msg);
           $scope.username = msg;
     });
    console.log($scope.username);//underfined
    });

解决方案

能把问题描述清楚吗，只看console无解
（题主：run需要使用广播将事件广播给其他controller，其他controller通过on接收到事件后在进行相应操作。
详情请看本回答下评论）

这篇关于javascript - angular的controller为什么会先于run运行？刷新页面对route的作用机理是什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！