Question

我绑定了我应用的鼠标移动来检查用户是否还在使用它：

<body data-ng-mousemove="data.OnMouseMove()"

我的控制器执行此操作：

$scope.data.OnMouseMove = function ()
{
    AccountService.RefreshToken();
};

这很好但如果用户连续移动鼠标则会中断动画。所以我想禁用mousemove事件20秒，但不知道如何。像这样的伪代码：

$scope.data.OnMouseMove = function ()
{
    document.getElementsByTagName("body")[0].data-ng-mousemove = "";

    AccountService.RefreshToken();

    window.setTimeout(function () 
    {
       document.getElementsByTagName("body")[0].data-ng-mousemove = "data.OnMouseMove()";
    }, 20000);
};

Answer 1

如果最近刷新了令牌，也许你的服务中可以有一个标志。如果是这种情况，那么只需在鼠标中返回void而不是事件。

Answer 2

我找不到任何动态更改ng-mousemove事件的方法。 AngularJS就是这样设计的。

唯一的其他AngularJS选项可能是编写自定义属性指令并动态使用$ compile和$ destroy来更改它。但我不知道那么做。

最简单，最快速的解决方案就是使用非Angular Javascript事件，您可以轻松绑定和取消绑定，并在此事件中调用Angular服务。

像这样：

"use strict";

var HandleMouseMoveOnBody = function()
{
    var htmlScope = angular.element(document.getElementById('htmlId')).scope(); //get access to angular from the outside
    htmlScope.data.OnMouseMove(); //refresh the token in Angular service

    $('body').off('mousemove'); //stop watching mouse movement as it slows the entire page

    //watch mouse movement again in a minute
    window.setTimeout(function() 
    {
        $('body').on('mousemove',  HandleMouseMoveOnBody);
    },  55000);        
};

//start watching
$(document).ready(function()
{
    $('body').on('mousemove', HandleMouseMoveOnBody);
});

在AngularJs中，如何绑定和取消绑定数据-ng-mousemove从控制器？

2 个答案: