javascript - angular中ng-click事件

问题描述

问 题

1. 我在ng-click事件中修改了$scope,为什么页面部分被修改的数据没有重新渲染

<ol>
        <li  ng-repeat="(index,obj) in thinglist" ng-class="{done:obj.isDone}" ng-click="do(index)">{{ obj.text }}      <button ng-click="delete(index)"> X</button>  </li> 
    </ol>

  $scope.reset=function(){
                var sum=0;
                this.thinglist.forEach(function (item,index){
                    if(!item.isDone){
                        sum++;
                    }
                })
                this.many=sum;
                // $scope.$apply();
                console.log(this.many);
            }
            $scope.add=function(ei){
                // console.log(this)
                this.thinglist.push({
                    text:this.thing,
                    isDone:false
                });
                this.thing="";
                // this.many++;
                this.reset();
                // console.log(this.thinglist);
            }
            $scope.do=function(index){
                // console.log(this);
                // this.many=this.many-1;
                this.thinglist[index].isDone=!this.thinglist[index].isDone;
                this.reset();
                // $emit('reset');                  
                // console.log($scope.$digest)
                // this.$digest();
                // console.log(this.many);
                // $scope.$apply;
                
            }

在reset方法里面我设置了修改many的值,每次调用下面的do和add的时候,只有add会重新渲染页面.

解决方案

送你一句话：this != $scope。

=======UPDATE========

尝试修改成这样：

    $scope.reset=function(){
                var sum=0;
                $scope.thinglist.forEach(function (item,index){
                    if(!item.isDone){
                        sum++;
                    }
                })
                $scope.many=sum;
                // $scope.$apply();
                console.log(this.many);
            }
            $scope.add=function(ei){
                // console.log(this)
                $scope.thinglist.push({
                    text:this.thing,
                    isDone:false
                });
                $scope.thing="";
                // this.many++;
                $scope.reset();
                // console.log(this.thinglist);
            }
            $scope.do=function(index){
                // console.log(this);
                // this.many=this.many-1;
                $scope.thinglist[index].isDone=!$scope.thinglist[index].isDone;
                $scope.reset();
                // $emit('reset');                  
                // console.log($scope.$digest)
                // this.$digest();
                // console.log(this.many);
                // $scope.$apply;
                
            }

这篇关于javascript - angular中ng-click事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！