ng-mouseover上的Angular JS Change Class

Question

当您使用AngularJS悬停按钮时，我试图将一个类（蓝色）添加到按钮。

HTML

<button class="btn-add-optimize" ng-mouseover="hover(iets)">Add and Optimize</button>

AngularJS

$scope.hover = function (iets) {
    var Dit = this;
    Dit.add("blue");
};

任何人都可以帮助我吗？最好是一个小例子，非常感谢！

Answer 1

我已经成功使用了这样的东西：

<button
    ng-class="{'some-class':hovering}"
    ng-mouseenter="hovering=true"
    ng-mouseleave="hovering=false">Add and Optimize</button>

输入和离开按钮切换$scope.hovering，some-class的应用程序取决于$scope.hovering范围变量为true。

Answer 2

<button
ng-class="{'some-class':hovering}"
ng-mouseenter="hovering=true"
ng-mouseleave="hovering=false">Add and Optimize</button>

您应该使用以下表格： ng-class

Answer 3

对于Angular 8，这对我有用：

<nav id="sidebar" [class]="!hovered ? 'active': ''" (mouseenter)='hovered=true' (mouseleave)="hovered=false">