7
在聚合物中，dom-repeat模板幫助程序每當將迭代結果標記到DOM中時都會發出dom-change事件。有沒有辦法讓我知道所有迭代完成的時間？如何判斷dom重複何時完成衝壓元素
A
回答
8
也許這個簡單的例子可以幫助解釋行爲並擴展評論。
<dom-module id="change-tester">
<template>
<h1>Change Tester</h1>
<ul>
<template id="template" is="dom-repeat" items="{{content}}">
<li>{{item}}</li>
</template>
</ul>
<button on-click="more">Add more</button>
</template>
</dom-module>
<script>
Polymer({
is: 'change-tester',
properties: {
content: {
type: Array,
value: function(){ return ["one", "two", "three"]}
}
},
ready: function(){
this.$.template.addEventListener("dom-change", function(event){
console.log(event);
});
},
more: function(){
this.push("content", "four");
this.push("content", "five");
}
});
</script>
每當dom-change被激發，我記錄事件到控制檯，所以打開開發者工具，看一看。最初，dom-repeat有三個迭代，並將用三個元素填充dom。請注意，只有一個事件會觸發，即所有三個元素都已添加。如果您點擊該按鈕，則會在重複內容中添加兩個項目。由於dom-repeat異步更新，這兩個項目再一次處理，只會觸發一個事件。
因此dom-change事件實際上是您正在尋找的最終事件。如果您操作與其綁定的物品，它只會再次觸發。
1
要訪問動態創建的節點（如模板重複） 使用：。
這$$（ '＃ID'）
這個$，而不是ID
例如，如果模板ID爲 「模板」，你應該使用
這一點。$$（ '＃模板'）
ready: function(){
this.$$('#template').addEventListener("dom-change", function(event){
console.log(event);
});
},
相關問題
- 1. 如何判斷animateLayoutChanges何時完成？
- 2. 如何判斷Image.FromStream完成
- 3. Android - 如何判斷MediaPlayer何時緩衝
- 4. 如何判斷MXML組件何時完全創建完成？
- 5. 如何判斷哪些事件綁定到DOM元素？
- 6. 如何判斷是否顯示DOM元素？
- 7. 如何判斷元素是否位於DOM中的另一個元素之前
- 8. 如何判斷JUnit何時通過使用TestWatcher完成？
- 9. Android：如何判斷服務何時完成
- 10. wpf如何判斷數據綁定何時完成？
- 11. 如何判斷Directshow.net轉換何時完成？
- 12. 如何判斷請求何時完成（ASIHTTPRequest）？
- 13. 如何判斷對象初始化程序何時完成
- 14. 如何判斷dde響應何時完成？
- 15. 如何判斷AudioTrack對象何時完成播放？
- 16. 如何判斷我的EAP呼叫批次何時完成？
- 17. 如何判斷location.reload（）何時完成刷新頁面？
- 18. 如何判斷IPC :: Run作業何時完成
- 19. 如何判斷MKMapView和可見MKAnnotationView何時完成繪圖？
- 20. 重複light dom元素
- 21. 如何判斷通過AppleScript完成iPod同步的時間
- 22. 複製完成Webbrowser元素？
- 23. 如何在AngularJS中生成DOM元素？
- 24. 如何判斷AVAudioPlayer播放完畢
- 25. 如何判斷tomcat何時啓動完成？ （用C＃控制服務）
- 26. 如何判斷量角器/茉莉花何時完成？ （報告工具邏輯）
- 27. 如何判斷頁面何時完成加載（服務器端，而不是JavaScript）
- 28. 如何判斷文件何時完成下載並準備使用？
- 29. 如何判斷avd何時完全啓動？
- 30. ALSA：如何判斷聲音何時播放完畢
是否有可能通過查看dom變更事件中的數據來確定此事 - 知道哪些數據項應該是最後的，然後檢查該數據？然而，也許不是理想的解決方案。 – newfivefour
https://github.com/Polymer/polymer/blob/master/src/lib/template/dom-repeat.html @ 348它在render（） –
結束時觸發了一個事件，正如Robert在'dom當「dom-repeat」模板的渲染完成時，會觸發-change'事件。然後，您應該能夠添加到您的模板中，以下代碼行將在該事件被觸發時執行一個函數：'' –