Question

我创建了一个函数，它应该在我在div中单击的位置上添加一个项目。现在这个功能的问题是，每次我点击，它需要x＆amp; y文档的位置，而不是x＆amp;在div内部的位置。所以我真正想要的是，我的div的左上角应该给x = 0＆amp; y = 0，但我不知道这是否可行？我想还有另一种方法可以做到这一点..

$scope.addOnClick = function(event) {
        $scope.items.push( {
            "label": "Click",
            "value": 100,
            "x": event.x-50,
            "y": event.y-50,
        })
}

Answer 1

您需要将event.x更改为event.offsetX，将event.y更改为event.offsetY

您没有添加模板定义，但我会在以下情况下添加它：

<div ng-click="addOnClick($event)"></div>

Answer 2

在html文件中，使用：

<div (click)="test($event)"></div>

在ts文件中的函数中：

function test(e){
 console.log(e.clientX);
 console.log(e.clientY);
}

Answer 3

对于那些使用拖动库并且想要拖动元素位置的角度的人：

<div ng-click="OnDrag($event)"></div>

并在控制器中

$scope.onDrag($event){
      console.log("X ->",$event.originalEvent.pageX,"Y ->",$event.originalEvent.pageY)

 }

angularJS - 获得x和; y鼠标点击div的位置

3 个答案: