小編給大家分享一下如何監(jiān)聽angularJs列表數(shù)據(jù)是否渲染完畢，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！
為府谷等地區(qū)用戶提供了全套網(wǎng)頁設計制作服務，及府谷網(wǎng)站建設行業(yè)解決方案。主營業(yè)務為成都網(wǎng)站建設、成都網(wǎng)站設計、府谷網(wǎng)站設計，以傳統(tǒng)方式定制建設網(wǎng)站，并提供域名空間備案等一條龍服務，秉承以專業(yè)、用心的態(tài)度為用戶提供真誠的服務。我們深信只要達到每一位用戶的要求，就會得到認可，從而選擇與我們長期合作。這樣，我們也可以走得更遠！
前端在做數(shù)據(jù)渲染的時候經(jīng)常會遇到在數(shù)據(jù)渲染完畢后執(zhí)行某些操作，這幾天就一直遇到在列表和表格渲染完畢后，執(zhí)行點擊和選擇操作。對于angularjs處理這類問題，最好的方式就是指令 directive。
首先，定義指令：
app.directive('onfinishrenderfilters', function ($timeout) {
return {
restrict: 'A',
link: function (scope, element, attr) {
if (scope.$last === true) { //判斷是否是最后一條數(shù)據(jù)
$timeout(function () {
scope.$emit('ngRepeatFinished'); //向父級scope傳送ngRepeatFinished命令
});
}
}
};
});其次，指令定義完畢后，需要將指令添加到迭代的標簽內(nèi)，此處是
標簽
|
{{i.name}}
|
{{$index+1}}
{{i.geoZoneName}}
{{i.description}}
{{i.totalNumberOfMembers}}
{{i.country}}
{{i.lastUpdateDate}}
最后，在最后一條數(shù)據(jù)渲染完畢后，brodercast是向子級scope傳送事件(命令)。而on()是監(jiān)聽事件，監(jiān)聽brodercast是否將事件(命令)傳送回來，若事件已傳送回來，則表示數(shù)據(jù)已經(jīng)渲染完畢，就可以執(zhí)行以后的其他操作了
$scope.$on('ngRepeatFinished', function (ngRepeatFinishedEvent) {
var btnList = $("input[name='btSelectItem']");
btnList.eq(0).attr("checked","checked");
$scope.provider.detalOutlet();
});在沒有angularJs的時候一般通過監(jiān)聽onLoad事件來確定頁面是否加載完成。但在使用angularJs來渲染頁面時，onLoad事件不能保證angularJs是否完成了對頁面的渲染。最常見的情況就是用angularJs來加載某個數(shù)據(jù)Table時，我們得等這個Table加載完之后對Table上的數(shù)據(jù)進行操作，但因為這個Table是由AngularJs渲染的，所以得找到某個方法獲得AngularJs渲染完畢后的事件。 這也就是為什么onload事件在angularJs框架上數(shù)據(jù)刷新不執(zhí)行的一個原因，因為angularJs是數(shù)據(jù)驅(qū)動，根據(jù)數(shù)據(jù)的更新進行頁面的刷新，而整體頁面已經(jīng)加載完成(數(shù)據(jù)更新，angularJs數(shù)據(jù)渲染，頁面不會重新加載)，故onload事件判定頁面沒有變化，所以不予執(zhí)行！
以上是“如何監(jiān)聽angularJs列表數(shù)據(jù)是否渲染完畢”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學習更多知識，歡迎關注創(chuàng)新互聯(lián)行業(yè)資訊頻道！
名稱欄目：如何監(jiān)聽angularJs列表數(shù)據(jù)是否渲染完畢
文章出自：http://weahome.cn/article/jjhdpg.html
-
在線咨詢
微信咨詢
電話咨詢
-
028-86922220（工作日）
18980820575（7×24）
-
提交需求
-
返回頂部
重慶分公司
重慶分公司
