it-swarm.com.de

Wie überprüfe ich, ob ein Element eine Klasse mit AngularJS hat?

Ich habe ein Off-Panel-Menü, das perfekt auf einer Site funktioniert. Der Benutzer kann es sowohl mit einem Navigationssymbol als auch mit dem Finger öffnen und schließen.

Im Moment habe ich ein sehr nettes Navicon-Symbol, das vom Menü-Symbol zum X-Symbol wechselt, wenn geklickt wird (und das Menü öffnet), und umgekehrt, wenn erneut geklickt wird und das Menü geschlossen wird. Wenn der Benutzer das Menü öffnet oder schließt, anstatt das Navicon zu verwenden, wird der Übergang nicht ausgelöst, was zu Verwirrungen in der UX führen kann (dh das Menü wird geschlossen, und das Navicon zeigt ein X anstelle der regulären 3 horizontalen Linien Symbol).

Das Navicon hat jetzt den folgenden Code, um den Übergang auszulösen:

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

Ich dachte, dass eine nette und einfache Möglichkeit, dies zu beheben, darin besteht, dieses "open =! Open" jedes Mal auszulösen, wenn das Menü geöffnet oder geschlossen wird, da das js aus dem Off-Panel die Klasse slidRight zum Hauptabschnitt hinzufügt, wenn das Das Menü ist geöffnet und wird beim Schließen entfernt.

Gibt es einen direkten Weg, um zu überprüfen, ob die Klasse AngularJS verwendet? So etwas wie wenn class = slidRight -> "open =! Open".

Vielen Dank!!

33
Eric Mitjans

Angular verwendet von Haus aus jqLites .hasClass ().

Lesen Sie hier in den angular Dokumenten nach, um weitere Informationen zu erhalten.

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

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

22
Mindstormy

für diejenigen (einschließlich mir), die sich nicht mit Angulars Dokumentation auseinandersetzen konnten, ist hier ein Beispiel, das für mich funktioniert hat:

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

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

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

hoffe das hilft jemandem ...

87
vidriduch