AngularJs渲染完畢後執行指定操作
最近用AngularJs做了一個Web的專案,AngularJs的設計真的很適合CRUD。真的建議很多內部的提高生產力的工具轉而採用Web,以AngularJs為框架。
通常的Web程式,我們需要在頁面載入完成的時候執行某些特定的操作,在沒有AngularJs的時候一般採用的是監聽onLoad event。但在使用AngularJs來渲染頁面時,onLoad不能保證AngularJs已經完成了頁面的渲染。最常見的情況就是用AngularJs來載入某個資料Table,我們得等這個Table載入完之後對Table上的資料進行操作,但因為這個Table是由AngularJs渲染的,所以得找到某個方法獲得AngularJs渲染完畢後的事件。
AngularJs原生directive或Method沒有提供這種功能,現在普遍的做法是通過寫一個directive繫結到我們需要監聽的元素上去獲得該元素的渲染完畢事件,現在就以ng-repeat為例:
具體的方法有兩種,一種是回撥函式,一種的事件通知。為了簡便,把兩種方法寫到一起了:
View
<ul>
<li ng-repeat="item in items" on-finish-render="callMethod()">
dummy Text
</li>
</ul>
Directive
.directive('onFinishRender',['$timeout', '$parse', function ($timeout, $parse) {
return {
restrict: 'A' ,
link: function (scope, element, attr) {
if (scope.$last === true) {
$timeout(function () {
scope.$emit('ngRepeatFinished'); //事件通知
var fun = $scope.$eval(attrs.onFinishRender);
if(fun && typeof (fun)=='function'){
fun(); //回撥函式
}
});
}
}
}
}])
事件處理
//捕獲 emited event
$scope.$on('ngRepeatFinished', function(ngRepeatFinishedEvent) {
});
相關推薦
AngularJs渲染完畢後執行指定操作
最近用AngularJs做了一個Web的專案,AngularJs的設計真的很適合CRUD。真的建議很多內部的提高生產力的工具轉而採用Web,以AngularJs為框架。 通常的Web程式,我們需要在頁面載入完成的時候執行某些特定的操作,在沒有AngularJs
AngularJs--ng-repeate渲染完畢後執行的程式碼
AngularJs呈現頁面的原理 AnguarJs提供了一些對於Html進行加強的語義標籤(directive),這些標籤在瀏覽器載入完頁面後被執行。舉例來說: <div ng-controller="ctrl2"> <inpu
spring boot容器加載完後執行特定操作
文件中 code buck 線程 private tor tope gets send 有時候我們需要在spring boot容器啟動並加載完後,開一些線程或者一些程序來幹某些事情。這時候我們需要配置ContextRefreshedEvent事件來實現我們要做的事情
在HTML頁面載入完畢後執行某個js
在DOM載入完就可以執行(比window.onload更早)。在同一頁面中可以多次出現.ready() 兩者主要區別:Window.onload=function (){}: 當一個文件完全下載到瀏覽器中時,才會觸發window.onload事件。這意味著頁面上的全部元素對js而言都是可以操
ajax非同步上傳檔案完成後執行其他操作
var fileCount=檔案個數;//計數器 $.ajax({ //寫死測試 url: baseUrl + "/dfs/upload/plugins/fileproxy/fileproxy?type=upload&
微信小程式之tab切換後執行onload操作
小程式tab切換後,不會執行onload操作,那麼我們在某tab列表進入詳情後,再次返回列表,需要重新重新整理頁面,該如何處理? 程式碼如下: 在呼叫wx.switchTab後,通過success操作,呼叫getCurrentPages().pop()方法獲取上一個頁面的
在Spring Boot啟動後執行指定程式碼
在開發時有時候需要在整個應用開始執行時執行一些特定程式碼,比如初始化環境,準備測試資料等等。 在Spring中可以通過ApplicationListener來實現相關的功能,不過在配合Spring Boot使用時就稍微有些區別了。 建立ApplicationList
HTML頁面載入完畢後執行某個js
1、js方法: <script type="text/javascript"> window.onload=function(){ alert("html頁面載入完成後一"); } </script> 2、jQuery方法:(需要引用j
利用angular指令監聽ng-repeat渲染完成後執行函式
很多時候,我們需要在ng-repeat渲染完成後再對其進行操作,那麼怎麼知道什麼時候渲染完成呢?今天工作中就遇到了這個問題,在網上查了一下,感謝大神的無私分享,整理了一下,加深記憶1.在ng-repea
JS頁面載入完畢後執行的多種方式和比較
做專案的時候可能會遇到這種情況: 一個頁面的中定義了多個onload事件,那麼在此定義window.onload函式的時候可能會不生效或者多個onload之間覆蓋的現象. 有的朋友肯定會說用jQuery的$$(document).ready(func
兩種方法實現在HTML頁面載入完畢後執行某個js:
Js方法:<script type=”text/javascript”> window.onload=function (){ var userName=”xiaoming”; alert(userName); } </script&
利用angular指令監聽ng-repeat渲染完成後執行指令碼
業務中有時需要在非同步獲取資料並用ng-repeat遍歷渲染完頁面後執行某個操作,angular本身並沒有提供監聽ng-repeat渲染完成的指令,所以需要自己動手寫。有經驗的同學都應該知道,在ng-repeat模板例項內部會暴露出一些特殊屬性$index/$first/$middle/$last/$o
Vue 如何在頁面渲染完後去操作dom,而且只執行一次
在介面請求成功的回撥裡使用 this.$nextTick(() =>{ // 在這裡面去獲取DOM })。 在mounted生命週期,元件掛載成功,但還未渲染,自然獲取不到相關的DOM節點。看你資料好像不是前端,舉個更簡單的例子,你在html中,把 consol
線程池: 等待線程池內所有線程執行完畢後再繼續任務
繼續 con col await mina cut bsp src code boolean loop = true; do{ loop=!executorService.awaitTermination(2, TimeUnit.SECONDS); }while(
並發實戰:多線程處理任務,結束後,執行後續操作
batch add 批次 for return countdown executors 操作 current 場景: 分批從大列表 blist 讀取數據,執行驗證過濾,符合條件的加入到列表中。然後執行批量入庫操作。 思路: 多任務從 blist 取數據執行,采用Excuet
CentOS安裝完畢後的操作
linux CentOS 系統安裝完成後0.網絡安裝費結束後需要修改# vi /etc/sysconfig/network-scripts/ifcfg-ens33TYPE=EthernetBOOTPROTO=dhcpDEFROUTE=yesPEERDNS=yesPEERROUTES=yesIPV4_F
avaScript實現頁面到滾動到指定位置執行某些操作
點擊 希望 ava pdo bsp log scroll 指定位置 blog 比如 頁面中 某個DOM, 希望點擊按鈕後頁面直接跳轉到 這個DOM所在的位置, 1. 獲取DOM離屏幕的高度 var hTop = $(‘#box‘).offset().top; $(‘bod
當redis執行flush操作後的補救措施
文件 type nag ext code 並保存 說明 write roc redis誤操作flushall的補救措施前提:開啟了aof持久化註意: 當執行了flushall或者flushdb等手殘命令,切記千萬不要觸發aof重寫 可以利用config set命令將如下
cin結束後再次執行輸入操作
今天使用cin迴圈讀入int型變數,while(cin>>i) 發現結束迴圈後想再次接受鍵盤輸入時不成功,直接退出了。 這是什麼原因呢? cin遇到ctrl+z便認為輸入結束,也就是不再接受鍵盤的輸入(但是它會讀取緩衝區已經存在的資料),此時ctrl+z還是會留在緩衝區內
svn執行update操作後出現:Error : Previous operation has not finished; run 'cleanup' if it was interrupted.
【轉載】原文連結:https://blog.csdn.net/JINYUANCAI/article/details/68922372 svn執行update操作後出現: Error : Previous operation has not finished; run ‘cleanup’