Javascript AngularJS-为什么ng mouseleave不能正常工作?
我在发布我的代码,因为为了我的缘故,我不明白为什么ng mouseenter和ng mouseleave不能正常工作。。。只有当鼠标从侧面(左/右)进入和离开时,它们才会正确启动,而当鼠标离开时,它们有时不会启动。。我不能使用css应用所需的类,因为我必须观察ctrl键按下事件,所以我必须坚持使用ng mouseenter/leave。我还尝试了ng mouseover/out——它们几乎不起作用。你知道为什么会这样,怎么解决吗?我会非常感激的 view.htmlJavascript AngularJS-为什么ng mouseleave不能正常工作?,javascript,html,css,angularjs,Javascript,Html,Css,Angularjs,我在发布我的代码,因为为了我的缘故,我不明白为什么ng mouseenter和ng mouseleave不能正常工作。。。只有当鼠标从侧面(左/右)进入和离开时,它们才会正确启动,而当鼠标离开时,它们有时不会启动。。我不能使用css应用所需的类,因为我必须观察ctrl键按下事件,所以我必须坚持使用ng mouseenter/leave。我还尝试了ng mouseover/out——它们几乎不起作用。你知道为什么会这样,怎么解决吗?我会非常感激的 view.html <div ng-cont
<div ng-controller="ControlCenterViewController as controlCenter">
<div class="controlcenter" ng-repeat="cat in controlCenter.categories">
<div class="controlcenter-category">{{cat.title}}</div>
<div class="controlcenter-shortcut" ng-repeat="shortcut in cat.exts"
ng-click="controlCenter.onSelect(shortcut, $event)" ng-class="class"
ng-mouseenter="controlCenter.hoverIn($event, shortcut)" ng-mouseleave="controlCenter.hoverOut($event, shortcut)">
<span class="shortcut-remove hidden-shortcut">
<clr-icon shape="times-circle" class="is-error" size="12"></clr-icon>
</span>
<span class="{{shortcut.icon}} controlcenter-shortcut-icon-display" ng-if="controlCenter.hasClass(shortcut)"></span>
<img class="controlcenter-shortcut-icon" ng-src="{{shortcut.icon}}" ng-if="!controlCenter.hasClass(shortcut)"/>
<div data-test-id="{{shortcut.targetViewUid}}" class="controlcenter-shortcut-label">{{shortcut.name}}</div>
</div>
</div>
</div>
css
当我在Angularjs中使用JQuery时,有几个问题 我看到很多老年人建议不要将JQuery与Angularjs一起使用 所以我建议一个 我希望这能对你有所帮助。:) 检查这把小提琴 也许这和你的目的不一样
但如果您想了解更多信息,请给我一些反馈。:) 您可以将JQuery与Angularjs一起使用,但必须将JQuery的$symbol设置为JQuery。您可以使用JSFIDLE或plunkr使代码可运行吗?addClass,removeClass ay是反模式的,这是JQuery方式。最好在跨度元素上显示ng或ng,并更改其可见性。只需在mouseenter或mouseleave函数中切换标志。此外,还必须检查PerspectiveService.IsEditeEnabled()返回的是什么。
function hoverIn(event, shortcut){
if(perspectivesService.isEditEnabled()){
console.log('hover in fired');
var target = angular.element(event.target).find('span.shortcut-remove');
if(event.ctrlKey){
target.removeClass('hidden-shortcut');
target.addClass('current-shortcut');
}
}
}
function hoverOut(event, shortcut){
if(perspectivesService.isEditEnabled()){
console.log('hover out fired');
var target = angular.element(event.target).find('span.shortcut-remove');
target.removeClass('current-shortcut');
target.addClass('hidden-shortcut');
}
}
.hidden-shortcut {
display: none;
}
.current-shortcut {
display: block !important;
}
myApp.controller('MyController', function($scope){
$scope.colorClass = 'red-div';
$scope.changeClass = function (css) {
$scope.colorClass = css;
};
});