web-dev-qa-db-ja.com

angularJS-divのマウスクリックからxおよびy位置を取得

Div内でクリックした位置にアイテムを追加する関数を作成しました。この関数の問題は、クリックするたびに、div内のxとyの位置ではなく、ドキュメントのxとyの位置を取ることです。私が実際に欲しいのは、divの左上隅にx = 0とy = 0を与えるべきですが、これが可能かどうかわかりませんか？そして、これを行う別の方法があると思います。

$scope.addOnClick = function(event) {
        $scope.items.Push( {
            "label": "Click",
            "value": 100,
            "x": event.x-50,
            "y": event.y-50,
        })
}
javascriptpositionangularjs
35
M. Winterinho

変更する必要があるevent.xからevent.offsetXおよびevent.yからevent.offsetY

テンプレート定義は追加しませんでしたが、念のため追加します。

<div ng-click="addOnClick($event)"></div>
60
Liviu T.

Htmlファイルでは、次を使用します。

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

そして、tsファイルの関数で::

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