Angular JS Изменить класс на ng-mouseover

Я пытаюсь добавить класс (синий) к кнопке, когда вы наведете кнопку с помощью 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");
};

Кто-нибудь может мне помочь? Предпочтительный небольшой пример, это было бы очень признательно!

Ответ 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.

Ответ 2

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

Вы должны использовать эту форму: ng-class