如何监听angularJs列表数据是否渲染完毕-创新互联

app.directive('onfinishrenderfilters', function ($timeout) {
  return {
    restrict: 'A',
    link: function (scope, element, attr) {
      if (scope.$last === true) {  //判断是否是最后一条数据
        $timeout(function () {
          scope.$emit('ngRepeatFinished'); //向父级scope传送ngRepeatFinished命令
        });
      }
    }
  };
});

  
    
    
      
      
        {{i.name}}
        

最后，在最后一条数据渲染完毕后，brodercast是向子级scope传送事件(命令)。而on()是监听事件，监听brodercast是否将事件(命令)传送回来，若事件已传送回来，则表示数据已经渲染完毕，就可以执行以后的其他操作了

$scope.$on('ngRepeatFinished', function (ngRepeatFinishedEvent) {
  var btnList = $("input[name='btSelectItem']");
  btnList.eq(0).attr("checked","checked");
  $scope.provider.detalOutlet();
});

在没有angularJs的时候一般通过监听onLoad事件来确定页面是否加载完成。但在使用angularJs来渲染页面时，onLoad事件不能保证angularJs是否完成了对页面的渲染。最常见的情况就是用angularJs来加载某个数据Table时，我们得等这个Table加载完之后对Table上的数据进行操作，但因为这个Table是由AngularJs渲染的，所以得找到某个方法获得AngularJs渲染完毕后的事件。 这也就是为什么onload事件在angularJs框架上数据刷新不执行的一个原因，因为angularJs是数据驱动，根据数据的更新进行页面的刷新，而整体页面已经加载完成(数据更新，angularJs数据渲染，页面不会重新加载)，故onload事件判定页面没有变化，所以不予执行！

以上是“如何监听angularJs列表数据是否渲染完毕”这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注创新互联行业资讯频道！