web-dev-qa-db-ja.com

要素にAngularJSのクラスがあるかどうかを確認するにはどうすればよいですか?

サイトで完全に機能するオフパネルメニューがあります。ユーザーは、Naviconを使用するか、指でスライドさせることで、開閉できます。

今、私は非常に素敵なnaviconアイコンを持っています。これは、クリックするとメニューアイコンからXアイコンに移行し(メニューを開く)、逆にもう一度クリックするとメニューが閉じると逆になります。 Buuutユーザーがnaviconを使用する代わりにメニューを開いたり閉じたりすると、遷移はトリガーされず、UXで混乱が生じる可能性があります(つまり、メニューが閉じられ、naviconは通常の3本の水平線ではなくXを表示します)アイコン)。

そのため、naviconには現在、移行をトリガーする次のコードがあります。

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

これを修正する素敵で簡単な方法は、メニューが開いたり閉じたりするたびにこの「open =!open」をトリガーすることだと思いました、オフパネルのjsがメインセクションにslidRightクラスを追加するときメニューは開いており、閉じると削除されます。

そうであれば、AngularJSを使用してクラスが存在するかどうかを直接チェックする方法はありますか? if class = slidRight-> "open =!open"。のようなもの

ありがとう!!

33
Eric Mitjans

AngularはjqLit​​eの.hasClass()をネイティブに使用します。

詳細については、angularのドキュメントを参照してください。

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

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

22
Mindstormy

angularのドキュメントを理解できなかった人(私を含む)のために、ここで私のために働いた例があります:

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

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

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

これが誰かを助けることを願っています...

87
vidriduch