关于angularjs中,数据模型被改变,页面不刷新的解决办法

刚用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