搜索

首页  >  问答  >  正文

angular.js - angular 中 $scope 不刷新的问题

请问我做了一个页面，其中header部分是ng include进来的（里面有logincontroller来判断是否显示login按钮），同时我在ngroute里面定义了一个登陆页面，它也用logincontroller，我通过$http拿到数据后回调给scope，但是视图页面没有更新，好像同一个controller有两个作用域一样，这是为什么？（我发现在nginclude完成的时候会执行一次logincontroller里面的东西，当进入登陆页面时又会触发一次）

我还尝试了网上说的$apply()结果会返回正在一个错误

    function($scope,$http,$location,$timeout,userService,notifyService) {
        $scope.login = {
            userid:"bbbbb",
        }
        $scope.user={islogged:0}
        $timeout(function(){ 
            //$scope.user={islogged:1}
            console.log($scope.user);
        },5000)
        $scope.httplogin = function(){
            $http({
                method:'POST',
                url:server.domain+server.login,
                data:{
                    userid:$scope.login.userid,
                    password:$scope.login.password,
                },
            }).success(function(d){
                if(d.code == 200){
                    $scope.login={userid:1111111}
                    $scope.user={islogged:1}
                    notifyService.make('success',d.data.msg,5)
                }else{
                    alert(d.msg)
                }
            })
        }

上面是controller的代码，其中在timeout里面由consolelog，如果打印它会一次出现三个，是不是我在三个地方都用了同一个ngcontroller的原因，如果注释调timeout中的$scope.user={islogged:1}，会打印成这样的，这样对于我的任务来说就不正常了，我希望他们都是相同的

Object {islogged: 0}
Object {islogged: 0}
Object {islogged: 1}

如果取消$scope.user={islogged:1}注释让它运行就会正常打印三个controller都是正常的了。

Object {islogged: 1}
Object {islogged: 1}
Object {islogged: 1}

================
刚刚又测试了下，它是只在当前触发的ngcontroller下修改了数值，如果多个ngcontroller的话其它ngcontroller的数值不会发生变化，不管是在nginclude还是ngview下都是这样。如何让同一个ngcontroller修改的数据能同步到另一处？

ringa_leeringa_lee2739 天前1022

全部回复(5)我来回复

  • 世界只因有你

    世界只因有你2017-05-15 16:53:08

    你确定是同一个scope吗？ng-include会创建新的scope的。

    看了代码之后

    确实是的每一个controller都是单独的实例的，互不影响。你可以考虑把数据状态放到一个全局（更上一层）的scope下；更好的方式应该是通过service统一来管理

    例如这样：

    html<body ng-app="app">

    <p ng-controller="loginCtrl">
        <pre>{{info}}</pre>
    </p>
    <script type="text/javascript">
    var app = angular.module('app', []);

    app.factory('login', ['$timeout', function($timeout){
        var ret = {

            info: {
                isIn: false
            }
        };

        // 模拟ajax请求
        $timeout(function() {
            ret.info.isIn = true;
        }, 1000);

        return ret;
    }]);

    app.controller('loginCtrl', ['$scope', 'login', function($scope, login){

        $scope.info = login.info;
    }])
    </script>
</body>

    回复
    0
  • 怪我咯

    怪我咯2017-05-15 16:53:08

    $scope.$apply()不行么？

    回复
    0
  • 漂亮男人

    漂亮男人2017-05-15 16:53:08

    最好先确定你在两个地方看到的 $scope 是同一个 scope，而不是其中一个是另一个的子 scope 什么的。

    回复
    0
  • 伊谢尔伦

    伊谢尔伦2017-05-15 16:53:08

    贴代码上来好些~

    回复
    0
  • 漂亮男人

    漂亮男人2017-05-15 16:53:08

    我也遇到相同的问题，$scope第一次改变的时候，界面上的数据不动，但当界面有了变化（比如说开始淡出时）数据就会立即变化，然后之后$scope再变的时候，界面就跟着变了。

    我也试过用$apply，但会报一大长串错误，据说好像是什么已经在使用了，之类的……也不懂……希望能有解答办法。

    回复
    0
  • 取消回复