如何检查元素是否具有 AngularJS 类? [英] How to check if element has class with AngularJS?

问题描述

我有一个在网站上完美运行的面板外菜单.用户可以使用导航图标或用手指滑动来打开和关闭它.

I have an off panel menu working perfectly on a site. The user can open and close it using both a navicon or sliding it with the finger.

现在我有一个非常漂亮的导航图标，当被点击(并打开菜单)时，它会从菜单图标转换为 X 图标，反之当再次点击并关闭菜单时.但是如果用户滑动打开或关闭菜单而不是使用导航图标，则不会触发转换，这可能会导致用户体验混乱(即菜单被关闭，导航图标显示 X 而不是常规的 3 条水平线图标).

Right now I have a very nice navicon icon that transitions from Menu Icon to X Icon when is clicked (and opens the menu) and the other way around when is clicked again and the menu closes. Buuut if the user slides the menu open or closed instead of using the navicon, the transition is not triggered, which might lead to confusions on the UX (i.e. the menu being closed, and the navicon showing an X instead of the regular 3 horizontal lines icon).

因此，导航图标现在具有以下代码来触发转换:

So, the navicon has right now the following code to trigger the transition:

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

我认为解决这个问题的一个很好且简单的方法是在每次打开或关闭菜单时触发这个open = !open"，因为来自关闭面板的 js 将类 slidRight 添加到主菜单打开时的部分，关闭时将其删除.

I thought that a nice and easy way to fix this, would be to trigger this "open = !open" every time that the menu is open or closed, as the js from the off panel adds the class slidRight to the main section when the menu is open, and removes it when it is closed.

既然如此，是否有一些直接的方法可以使用 AngularJS 来检查该类是否存在?类似于 if class = slidRight -> "open = !open".

Being so, is there some straight way to check if the class is there using AngularJS? Something like if class = slidRight -> "open = !open".

谢谢！！

推荐答案

Angular 原生使用 jqLit​​e 的 .hasClass().

Angular uses jqLite's .hasClass() natively.

在此处阅读 angular 文档以了解更多信息.

Read here on the angular docs for more info.

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

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

这篇关于如何检查元素是否具有 AngularJS 类?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！