programing

jQuery 클릭 이벤트가 Angular 내에서 발생하지 않음JS 템플릿

powerit 2023. 3. 29. 21:56
반응형

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>

이는 템플릿을 사용하는 지시어를 사용하는 경우에도 마찬가지입니다.이상하고 드롭다운 메뉴로 많은 문제를 일으키고 있어요.

왜 이런 일이 일어나는지 아는 사람 있나요?

이왕이면clickmeDOM에서는 아마 사용할 수 없을 것입니다.로드 시 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

반응형