如何检查元素是不是具有AngularJS的类？

Posted 2023-02-21

【中文标题】如何检查元素是不是具有AngularJS的类？

【英文标题】：How to check if element has class with AngularJS?如何检查元素是否具有AngularJS的类？

【发布时间】：2014-02-07 04:26:43

【问题描述】：

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

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

所以，navicon 现在有以下代码来触发转换：

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

我认为解决此问题的一种好方法是，每次打开或关闭菜单时触发此“open = !open”，因为来自关闭面板的 js 将类 slidRight 添加到主菜单打开时的部分，关闭时将其删除。

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

谢谢！！

【参考方案1】：

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

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

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

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

【讨论】：

请求在 ng-click 中检测类的内联方式

【参考方案2】：

对于那些无法理解 Angular 文档的人（包括我），这里有一个对我有用的示例：

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

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

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

希望这对某人有所帮助...

【讨论】：

不用angular.element(myElement)，myElement.hasClass(...)就够了。

无点！谢谢！

angular.element() 适用于以下情况：const el = document.getElementById(id); angular.element(el).hasClass(...);