반응형
jQuery 클릭 이벤트가 Angular 내에서 발생하지 않음JS 템플릿
아무도 이런 일을 경험하지 못한 좀 이상한 경우일 수도 있지만 혹시나 하는 마음에 제가 모르는 걸 누군가 알고 있다는 것을 알려드립니다.
jQuery 2.0.3과 Angular를 사용하고 있습니다.JS.
내가 닻을 내리면index.html
다음과 같이 합니다.
# index.html
<a href="#" class="clickme">Click Me</a>
<script type="text/javascript">
$(function() {
$('.clickme').click(function() { console.log("click"); });
});
</script>
그러면 동작합니다.클릭하면 '클릭'이 출력됩니다.하지만 이 템플릿을 템플릿에 포함시키면ng-include
특성: jQuery가 갑자기 실행되지 않습니다.앵커가 있는 템플릿 안에 스크립트를 배치하면 실행이 됩니다.
# index.html
<div ng-include="'path/to/template.html'"></div>
# template.html
<a href="#" class="clickme">Click Me</a>
<script type="text/javascript">
$(function() {
$('.clickme').click(function() { console.log("click"); });
});
</script>
이는 템플릿을 사용하는 지시어를 사용하는 경우에도 마찬가지입니다.이상하고 드롭다운 메뉴로 많은 문제를 일으키고 있어요.
왜 이런 일이 일어나는지 아는 사람 있나요?
이왕이면clickme
DOM에서는 아마 사용할 수 없을 것입니다.로드 시 Angular에 의해 DOM에 푸시됩니다.template.html
- jQuery 이벤트 위임을 사용하는 대신.click
:
$(document).on("click", ".clickme", function() {
console.log("click");
});
이렇게 하면 jQuery가 문서에 바인드된 후, 다음 명령을 사용하여 요소의 클릭 이벤트를 모니터링합니다.clickme
학급.
언급URL : https://stackoverflow.com/questions/18876537/jquery-click-events-not-firing-within-angularjs-templates
반응형
'programing' 카테고리의 다른 글
악성코드가 CORS를 악용하기 위해 "Origin" 헤더를 스푸핑하는 것을 방지하려면 어떻게 해야 합니까? (0) | 2023.03.29 |
---|---|
gson이 사용자 지정 역직렬화에서 표준 역직렬화를 호출함 (0) | 2023.03.29 |
어레이에서 $$hashKey 제거 (0) | 2023.03.29 |
리액트 linter Airbnb proptypes 어레이 (0) | 2023.03.29 |
에서 클래스를 추가하는 방법에서 클래스를 추가하는 방법Wordpress에서 wp_nav_menu()를 사용하고 있습니까? (0) | 2023.03.29 |