AngularJS - 如何在mousemove上存储鼠标坐标？

Question

尝试翻译的东西我没有角已经努力工作,与棱角分明,而且似乎我的理解角度较不清楚比我想象:

我有许多静态div和一个跟随鼠标的可移动div.如果用户在可移动div与静态div重叠时单击,则会触发事件(当前为Bootstrap模式).目前,它还计算鼠标和静态div的距离,并根据距离改变背景颜色(即更接近红色div,背景更亮红色,更接近蓝色div,背景更亮蓝色,两者之间,颜色淡化/混合从红色到紫色到蓝色等).

目前,我只是想在鼠标移动时捕捉鼠标位置.下一个目标是找到每个静态div的中心点.

Answer 1

您可以使用ng-mousemove指令并将鼠标事件传递给角度控制器.

请参阅此plnkr以获取示例.

视图

<div class="big" ng-controller="TestCtrl" ng-mousemove="captureCoordinate($event)">
    <div>x: {{x}}</div>
    <div>y: {{y}}</div>
</div>

调节器

   $scope.captureCoordinate = function($event){
      $scope.x = $event.x;
      $scope.y = $event.y;
   }

与ng-mousemove指令一起,您可以将$ event对象传递给控制器​​函数,并从那里获取x和y坐标.