angular.js - [angular]数组清空后,视图没有马上更新
PHP中文网
PHP中文网 2017-05-15 16:52:44
0
3
577

最近在开发一个数据列表时遇到问题:
该数据列表有一个搜索功能,当输入时,会立即根据输入的关键词,从服务端请求搜索结果。然后视图马上渲染结果。具体代码如下:

app.controller('ListViewController',function($scope){ $scope.files=[]; $scope.vm={ key:'' }; $scope.query=function(){ var param={ nameFuzzy:$scope.vm.key } $http.post(url,param) .success(function(resp){ angular.each(resp,function(item){ $scope.files.push(item); }); }); }; $scope.$watch('vm.key',function(newVal,oldVal){ if(newVal!==oldVal){ //关键词发生变化时,清空列表 $scope.files.length=0; //然后请求数据 $scope.query(); } }); $scope.query(); });

现在的问题在于:当清空数组时,视图上的列表没有消失,待搜索结果返回后,并渲染成功,前一个列表才消失,也就是说,两组数据会同时存在几百毫秒的样子,前一组数据才消失,调用$scope.$apply()并没有什么用,会抛出错误:degist in progress,说明已经在更新视图中,但是不知道为什么会这么慢。
ps:还有其它数据列表,则没有这个问题

PHP中文网
PHP中文网

认证高级PHP讲师

reply all (3)
滿天的星座

Try callingscope.$digest();Does this work?

    Peter_Zhu

    app.controller('ListViewController',function($scope){

    $scope.files=[]; $scope.vm={ key:'' }; $scope.query=function(){ var param={ nameFuzzy:$scope.vm.key } $scope.files=[]; //增加 $http.post(url,param) .success(function(resp){ angular.each(resp,function(item){ $scope.files.push(item); }); }); };

    });

    Just use ng-change="query()" in the keyword input box in the template. Don’t abuse watch unless you know how to use it

      洪涛


      `$timeout(function(){
      $scope.files = [];
      })`

        Latest Downloads
        More>
        Web Effects
        Website Source Code
        Website Materials
        Front End Template
        About us Disclaimer Sitemap
        php.cn:Public welfare online PHP training,Help PHP learners grow quickly!