yonia
yonia

Reputation: 1741

Angularjs mouse enter event

I would like to change the ng-mouse enter event so only if the user hoovered for more then a second on the spot the event will fire seems like ng-model-options="{ debounce: 1000 }" is not working for this event

Any ideas ?

Upvotes: 2

Views: 796

Answers (2)

Naeem Shaikh
Naeem Shaikh

Reputation: 15715

<button ng-mouseenter="myEvent()" ng-mouseleave="myEvent2()" > </button>


$scope.flag=false;
$scope.myEvent = function() {
$scope.flag=true;
  $timeOut(function(){


    if($scope.flag)
    {
      // do your logic here

    }
  }, 1000);
}

$scope.myEvent2 = function() {
    $scope.flag=false;
}

here you can set a timeout on the mouseenter, and check if the flag is made false by the mouse leave, this logic will only execute if the user has not done mouseleave for 1 sec.

Upvotes: 2

Mahesh Thumar
Mahesh Thumar

Reputation: 4395

You can not set event fire time using ng-model. You will have to set delay in your event event only. For e.g.

<button ng-mouseenter="myEvent()"> </button>

$scope.myEvent = function() {
  $timeOut(function(){
    // do your function logic here.
  }, 1000);
}

Upvotes: 0

Related Questions