首先說(shuō)的當(dāng)下的技術(shù)環(huán)境:angular1.6,ui-route,require,疑問(wèn):
1、ui-route加載的template和動(dòng)態(tài)注冊(cè)的controller誰(shuí)先被編譯執(zhí)行?例如:我想獲取template的#id的寬必須要$timeout?否則就出現(xiàn)undefine
2、自定義指令的compile是不是先于template加載?還是并行加載?
有點(diǎn)混亂,跪求解答,相關(guān)文章和解惑也跪謝!
附加題:{{}}會(huì)自動(dòng)將類型轉(zhuǎn)化為字符串吧?
謝謝,回答部分也非常感謝
閉關(guān)修行中......
官方有解釋,關(guān)于編譯過(guò)程的詳細(xì)介紹:
HTML 編譯分三個(gè)階段進(jìn)行:
$compile 遍歷 DOM 并匹配指令。
如果編譯器發(fā)現(xiàn)某個(gè)元素與某個(gè)指令匹配,則該
指令將添加到與 DOM
元素匹配的指令列表中。單個(gè)元素可能匹配多個(gè)指令。
一旦識(shí)別出與 DOM 元素匹配的所有指令,
編譯器就會(huì)按優(yōu)先級(jí)對(duì)指令進(jìn)行排序。
執(zhí)行每個(gè)指令的編譯函數(shù)。每個(gè)compile
函數(shù)都有機(jī)會(huì)修改DOM。每個(gè)編譯函數(shù)
返回一個(gè)鏈接函數(shù)。這些函數(shù)組成一個(gè)
“組合”鏈接函數(shù),它調(diào)用每個(gè)指令返回的
鏈接函數(shù)。
$compile 通過(guò)調(diào)用上一步中的組合
鏈接函數(shù)將模板與范圍鏈接起來(lái)。這反過(guò)來(lái)將調(diào)用各個(gè)指令的
鏈接函數(shù),在元素上注冊(cè)偵聽(tīng)器
,并按照每個(gè)
指令配置的范圍設(shè)置 $watchs。
其結(jié)果是范圍和 DOM 之間的實(shí)時(shí)綁定。所以此時(shí),編譯范圍內(nèi)模型的更改將反映在 DOM 中。
具體請(qǐng)題主詳讀 https://docs.angularjs.org/gu...這篇關(guān)于編譯器的文章。
我認(rèn)為的順序應(yīng)該是這樣的:加載template同時(shí)走controller,在controller里初始化數(shù)據(jù),然后進(jìn)入$digest階段來(lái)render template。所以controller加載過(guò)程中你獲取template的#id的寬就有可能得不到。
寫一個(gè)$timeout,會(huì)在$digest結(jié)束后執(zhí)行timeout里面的代碼,并再次觸發(fā)一次$digest.
自定義指令的compile階段其實(shí)是確定template的結(jié)構(gòu),compile階段可以更改template的結(jié)構(gòu),link階段就是準(zhǔn)備數(shù)據(jù),然后render template。
如有不對(duì),歡迎指正討論。