Angular? ?? ? ?? ?? ?? ?? ??? ?? ??? ??? ??? ??? ?? ? ??? ?? ?? ?????? ??? ?? ?? ?? ??? ???? ????. ???? ?????:
???ng-repeat
? ???? JS ??? ??? ?? ? ??? ng-repeat
? ???? ??? ???? ????. Angular ?? ?? ??????
??? ??? ??? ??? ??? jquery
=> angular
? ???? ?? ?????. jquery
=> angular
的錯(cuò)誤表現(xiàn)形式。
AngularJS
的指令,作為一種“聲明式”的API,玩法和jquery
那套“命令式”API有很大區(qū)別,你在混著用的時(shí)候,很容易出錯(cuò)。
基本常識(shí)錯(cuò)誤,id
是用來(lái)表示元素唯一性的,可你用在了ng-repeat
上,也就是說(shuō)可能出現(xiàn)若干個(gè)元素的id
都是need-another-js
,這和jquery
、angular
都沒(méi)關(guān)系,純粹是html
知識(shí)上的缺失
ng-repeat
作為angular
提供的指令,需要經(jīng)過(guò)angular
的compile
、linking
過(guò)程,導(dǎo)致,當(dāng)你的$('#need-another-js').click
在為#need-another-js
元素注冊(cè)事件的時(shí)候,這個(gè)元素其實(shí)還沒(méi)有被angular
生成到DOM
中,這才是沒(méi)生效的關(guān)鍵。
單就你這個(gè)例子來(lái)講,可以做如下修改使之生效:
<p ng-repeat="item in list" class="need-another-js"></p>
不用
id
用class
<script>
$(document).on('click', '.need-another-js', function(){
// do something
});
</script>
雖然我不推薦這種寫法,但你既然選擇了"命令式"和聲明式
API混用,想必有你的理由。
補(bǔ)充:
關(guān)于angular
AngularJS
? ??? "???" API?? jquery
? "???" API? ?? ????. ?? ???? ???? ????. .
id
? ??? ???? ???? ? ????? ng-repeat
? ???? ??? ?? ?? ?? ? ????. id
? ?? need-another-js
???. ?? jquery
?? angular
? ??? ????. ??? html
?? ??ng-repeat
? angular
?? ???? ???? angular
? ???
? ??? ???. ? ??
????? ?? $('#need-another-js').click
? #need-another-? ?? ???? ??? ? ?????. js
?? ?? ? ??? angular
? ?? DOM
? ??? ???? ?????. ??? ??? ?????. ??? ?? ?? ??? ?? ???? ??????.
???????? ????? ?? ??? ????? ??? "???" API?class
??id
? ???????
???
API? ????? ??????? ??? ?? ????. ??
?????: ??
?? angular
? ?? ??? ???? ?? ?????? ?? ??? ??? ?? ? ??? ????? ??? ? ? ????. ??
??????????
???? ??: Concepts??Angular? ?? ? jq?? angle? ?? ??????. Angular? jq? ? ? ?? ?? ?? ? ? ????
ng-repeat? dom ??? ???? ???? ????. click ???? ???? ???? ??? ??? ???? ????? ????? ????. Jquery? ???? ??? leftstick?? ??? ??? ????? mumofa?? ??? ?? ??? ???? ?? ????