Javascript 停止$timeout-AngularJS

当我将鼠标移到按钮上时，会显示一个弹出对话框。当我鼠标移出时，弹出对话框将在两秒钟内隐藏。当我第二次将鼠标滑过按钮时，问题出现了。即使我的光标仍在按钮上，弹出对话框也会在两秒钟内隐藏。当鼠标再次停留在按钮上时，如何停止计时器？

该服务返回一个承诺，可以使用取消该承诺。在您的情况下，您必须取消鼠标上每个按钮的超时

JAVASCRIPT

var app = angular.module('myapp', []);

app.controller('PopupCtrl', function($scope, $timeout){
$scope.show = 'none';


  $scope.mouseover = function(){
    console.log('Mouse Enter');
    $scope.show = 'block';
  };

  $scope.mouseout = function(){

       console.log('Mouse Leave');
        var timer = $timeout(function () {
          $scope.show = 'none';
        }, 2000);


  };

});

var app = angular.module('myapp', []);

app.controller('PopupCtrl', function($scope, $timeout){
  var timer;
  $scope.show = false;

  $scope.mouseover = function(){
    $timeout.cancel(timer);
    $scope.show = true;
  };

  $scope.mouseout = function(){
    timer = $timeout(function () {
      $scope.show = false;
    }, 2000);
  };

});