AngularJs中，如何在render完成之后，执行Js脚本

大佬教程收集整理的这篇文章主要介绍了AngularJs中，如何在render完成之后，执行Js脚本，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

AngularJs是Google开源的前端JS框架。使用AngularJs,我们能够容易地、健壮的开发出类似于Gmail一样的单页Web应用。AngularJs这个新兴的MVC前端框架，具有以下特点: MVC,模块化，自动化双向数据绑定，语义化标签、依赖注入等。

AngularJs和Jquery的有什么不同?

@H_262_6@ Jquery的主要目的是简化Js编写，专注于浏览器跨平台，主要用来操作DOm.
AngularJs主要关注Html数据的获取和呈现，以及应对日益复杂的Web应用需求，使得开发庞大的Web应用能够更加容易。

AngularJs呈现页面的原理

@H_262_6@ AnguarJs提供了一些对于Html进行加强的语义标签(directivE)，这些标签在浏览器加载完页面后被执行。举例来说:

@H_262_6@

@H_262_6@

<table id=”leaderBoard”>
          thead>
              tr>
                  th>Id</>Name>Salarytbodytr ng-repeat="user in users"td>{{user.ID}}>{{user.NamE}}>{{user.Salary}}>
table>

@H_262_6@

@H_262_6@ 上面的ng-repeat，就是一个directive,相当于一个for循环。在页面加载完成后，AngularJs会遍历users数据对象，来呈现(render)出这个table中的内容。

如何实现在render完成之后，执行Js脚本

@H_262_6@ 当我们使用Jquery结合AngulraJs使用的时候，希望在render完table后，执行一段js脚本，把JqTable应用到该table上。在实际开发中，会经常碰到这样的需求，希望能够捕获到AngularJs渲染完成页面的事件。
要达到这个目的，我们需要为当前的app自定义directive:

@H_262_6@

app.directive('onFinishRenderFilters',function ($timeout) {
    return {
        reStrict: 'A',link: function(scope,element,attr) {
            if (scope.$last === true) {
                $timeout(function() {
                    scope.$emit('ngRepeatFinished');
                });
            }
        }
    };
});

然后，在我们需要监控的地方，加上该directive:
@H_262_6@

="user in users" on-finish-render-filters>
      >

最后，补充上我们需要render完成之后的Js脚本:

$scope.$on('ngRepeatFinished',255); line-height:1.5!important">function (ngRepeatFinishedEvent) {
          //下面是在table render完成后执行的js
          var table = $("#leaderBoard").dataTable({
              bJQueryUI: true,"sScrollX": '100%',});
});

大佬总结

以上是大佬教程为你收集整理的AngularJs中，如何在render完成之后，执行Js脚本全部内容，希望文章能够帮你解决AngularJs中，如何在render完成之后，执行Js脚本所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。