Javascript ng-mouseover 上的 Angular JS 更改类
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/27371711/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Angular JS Change Class on ng-mouseover
提问by Staafsak
Am trying to add a class (blue) to a button when ever you hover the button using AngularJS.
当您使用 AngularJS 悬停按钮时,我正在尝试向按钮添加一个类(蓝色)。
HTML
HTML
<button class="btn-add-optimize" ng-mouseover="hover(iets)">Add and Optimize</button>
AngularJS
AngularJS
$scope.hover = function (iets) {
var Dit = this;
Dit.add("blue");
};
Anyone can help me out? Preferable a small example, it would be very appreciated!
任何人都可以帮助我吗?最好是一个小例子,将不胜感激!
回答by Collin Allen
I've used something like this with success:
我已经成功地使用了这样的东西:
<button
ng-class="{'some-class':hovering}"
ng-mouseenter="hovering=true"
ng-mouseleave="hovering=false">Add and Optimize</button>
Entering and leaving the button toggles $scope.hovering, and the application of some-classis contingent on the $scope.hoveringscope variable being true.
进入和离开按钮切换$scope.hovering, 的应用some-class取决于$scope.hovering范围变量是true。
回答by Ercan
<button
ng-class="{'some-class':hovering}"
ng-mouseenter="hovering=true"
ng-mouseleave="hovering=false">Add and Optimize</button>
You should use this form : ng-class
你应该使用这种形式:ng-class
回答by QauseenMZ
For Angular 8, this works for me:
对于 Angular 8,这对我有用:
<nav id="sidebar" [class]="!hovered ? 'active': ''" (mouseenter)='hovered=true' (mouseleave)="hovered=false">

