解决angularjs+bootstrap轮播图不自动播放
之前我写过一篇关于《angularjs+bootstrap 写轮播效果》，这里关于页面布局的相关代码就不多说了，大家想看的可以去这个地址：
http://www.toutiao.com/i6406132881248223746/
后来，发现一个问题，就是轮播图不会自动播放。
研究来研究去，才发现，bootstrap的效果是基于window.load()事件触发的，而angularjs则是在浏览器加载完页面后执行的，所以，当它触发的时候，angular还没有开始渲染。
因此，这个问题的解决办法就要在angularjs渲染完成之后，再开始执行触发轮播事件。
首先，我们需要自定义个一个指令，这个网上有很多，大家根据自己的需求来：
app.directive("onFinishRender", function ($timeout) {
return {
restrict: "A",
link: function (scope, element, attr) {
if (scope.$last === true) {
$timeout(function () {
scope.$emit("ngRepeatFinished");
});
}
}
}
});
上面这个指令很好理解，$last是最后一条数据，所以，判断当最后一条数据渲染完成后，scope.$emit触发定义的事件监听“ngRepeatFinished”。
然后，我们在html中插进轮播代码的地方引入上面自定义的指令属性：
<div ng-bind-html="trustHtml" on-finish-render></div>
最后，我们在controller中，添加下面这段代码：
$scope.$watch("ngRepeatFinished", function( ngRepeatFinishedEvent ) {
$(".carousel").carousel();
})
上面的代码就是监听当轮播渲染完成后，开始执行自动播放。
还有值得注意的一点是，我看网上有的是用的$scope.$on(）这个来监听的，我试了之后没效果。换了$scope.$watch(）这个是有效果的。
大家有高见的留言指教。多谢！！！
