angularjs页面不刷新的解决办法

Home / Article MrLee 2016-7-27 6132

刚用angularjs时,确实被它的双向数据绑定震住了,但同时没有完合使用angularjs的方法,从而出现数据模型被改变,但页面不能随之更改,需要$scope.$apply()强制更新数据模型.
实际上出现这种情况,就是因为在angularjs中使用了JS方法产生数据源,看下面代码:
    var myApp = angular.module("myApp",[]);  
    myApp.controller("mainController", function ($scope) {  
        $.get("/articlelist",{},function(data){  
            $scope.data=data;  
        });  
        $scope.updatedate = function(id,age){  
        $.get("/update",{id:id,age:age},function(data){  
            item.age=age;//这里你会发现值变了,但页面没刷新  
            $scope.$apply();//需要手动刷新  
            console.log(item);  
        });  
        }  
    });
很多人都用过这种方式来取值或更新数据,发现页面并没有随着更新而改变,需要手动刷新.
这是由于angularjs的watch不能监听到JS对$scope.data的更改.更改一下写法,就可以实现了
    var myApp = angular.module("myApp",[]);  
    myApp.controller("mainController", function ($scope,$http) {  
        $http.get("/articlelist").success(function(data){  
            $scope.data=data;  
        });  
        $scope.updatedate = function(id,age){  
        $http.get("/update?id="+id+"&age="+age).success(function(data){  
            item.age=age;//页面随着改变刷新  
        });  
        }  
    });
可能有人会说,JQUERY能跨域,其实angularjs也可以的.参考:NodeJS+ExpressJS解决跨域请求CORS

本文链接:https://www.it72.com/9823.htm

推荐阅读
最新回复 (0)
返回