AngularJs关于页面更新

简介

        使用Angular或者Vue的都知道，这两种语言都是操作数据从而促使页面自动更新，但是有的时候即使数据改变了页面也不会更新，这一节我们探讨什么时候数据更新了但是页面却没更新。        

第一组组代码

       

               

                        {{name}}

                        改变值

                

               

        

总结：有这个例子我们可以总结出，非ng-指令的方法不能使Angular的页面更新,由此我们也得出一个结论ajax请求成数据赋值，不会更新页面。

第二组代码

       

           

                    {{name}}

            

           

       

总结：$scope.apply();可以在ajax请求数据之后更新页面。

属性监听器

        属性监听器是用来监听值的变化，从而可以执行相应的操作

        $scope.$watch(function(newVal,oldVal) {

                //newVal新值  oldVal旧值

        })

内置定时器

            $interval(function() {

                    $scope.age += 1;

            },1000)

            $timeout(function() {

                    $scope.name = "new val"

            },1000);

注意：使用前请先在控制器内注入，并且两种方式都会更新页面。

总结:ng-指令可以出发页面的更新，ajax请求成功数据直接赋值无法触发页面更新，必须手动更新（$scope.apply()）,内置定时器可以出发页面的更新。

---

                                                        不积跬步无以至千里,不积小流无以成江海