Question

为了解释我想要做的事情，我创建了一个你可以玩的例子：

http://plnkr.co/edit/usrmiNkj5YJY5SlV8ETw?p=preview

我想在鼠标停止时绘制多个绿色瓷砖。这样：

<div ng-mousedown="drawImage($parent.$index,$index)"></div>

仅当鼠标在不在外面的元素上向下时才有效。

有没有办法检查鼠标是否已经关闭并将图块拉成绿色？

请使用我创建的代码创建一个工作示例。

Answer 1

你必须包含一些事件处理程序，用于mouseup和mousemove，就像这样

<div class="tile" ng-repeat="x in y track by $index" ng-class="x" ng-mouseup="removeFlag()" ng-mousedown="setFlag($parent.$index,$index)" ng-mousemove="drawImage($parent.$index,$index)"></div>

然后添加功能

$scope.drawImage = function(y,x){
  if ($scope.mouseIsDown)
    $scope.map[y][x] = "green";
}

$scope.setFlag = function(y,x){
   $scope.mouseIsDown = true;
   this.drawImage(y,x)
}

$scope.removeFlag = function(){
   $scope.mouseIsDown = false;
}

当鼠标按下时设置一个标志，并在光标移动到元素和鼠标停止时设置颜色。

PLNKR

angularjs - mousedown＆amp;鼠标按下事件时移动元素？

1 个答案: