sourcecode

요소가 AngularJS와 클래스가 있는지 확인하는 방법

copyscript 2023. 3. 15. 19:53
반응형

요소가 AngularJS와 클래스가 있는지 확인하는 방법

사이트에서 완벽하게 작동하는 오프 패널 메뉴가 있습니다.사용자는 Navicon을 사용하거나 손가락으로 슬라이드하여 열고 닫을 수 있습니다.

현재 매우 멋진 navicon 아이콘이 있습니다.클릭하면 메뉴 아이콘에서 X 아이콘으로 전환됩니다(그리고 메뉴를 엽니다).또 다시 클릭하면 메뉴가 닫힙니다.사용자가 Navicon을 사용하는 대신 메뉴를 열거나 닫으면 전환이 트리거되지 않으며, 이로 인해 UX에서 혼란이 발생할 수 있습니다(즉, 메뉴가 닫히고 Navicon이 일반적인 3개의 수평선 아이콘 대신 X를 표시합니다).

따라서 현재 Navicon에는 전환을 트리거하는 다음과 같은 코드가 있습니다.

ng-click="open = !open" ng-class="{'open-mob':open}">

이 문제를 해결할 수 있는 좋은 방법은 메뉴가 열리거나 닫힐 때마다 이 "열림= !open"을 트리거하는 것이라고 생각했습니다. 오프 패널의 js는 메뉴가 열리면 클래스 slidRight를 메인 섹션에 추가하고 닫히면 클래스 slideRight를 추가합니다.

그렇다면 AngularJS를 사용하여 클래스가 있는지 확인할 수 있는 방법이 있습니까?class = slideRight -> "open = !open"과 같은 입니다.

감사합니다!!

Angular의 문서를 이해할 수 없었던 분(저를 포함)을 위해 다음과 같은 예를 제시하겠습니다.

angular.element(myElement).hasClass('my-class');

angular.element(myElement).addClass('new-class');

angular.element(myElement).removeClass('old-class');

이것이 누군가에게 도움이 되기를 바란다...

Angular는 기본적으로 jqLite의 .hasClass()를 사용합니다.

자세한 내용은 각진 문서를 참조하십시오.

http://docs.angularjs.org/api/angular.element

https://docs.angularjs.org/api/ng/function/angular.element

언급URL : https://stackoverflow.com/questions/21192705/how-to-check-if-element-has-class-with-angularjs

반응형