Geek Answers Handbook

How to read mouse position in angularjs when click is done?

I want to get the in-element (x, y) position of the ng-clicked element . Uses clientXand clientYtransforms by scrolling the page. Usage pageXand pageYdoes not depend on scrolling, but it is absolute. These four properties belong to the object $eventaccessible inside the directive ng-click. How would I calculate in-element x and y?

In jQuery, I would do something like:

$("#something").click(function(e){
    var parentOffset = $(this).parent().offset(); 
    //or $(this).offset(); if you really just want the current element offset
    var relX = e.pageX - parentOffset.left;
    var relY = e.pageY - parentOffset.top;
});

But now I want to do this in angularjs (i.e. inside controller, not inside the postLink function). What is a good way to do this? Is it possible to do the same, but using angular.element? Or is there another way to calculate the values ​​I need?

Edit Clarification: in the controller, I would try:

$scope.onClick = function($event) {
    //currently I can...
    var pageX = $event.pageX;
    var pageY = $event.pageY;
};

, , . HTML:

<div ng-click="onClick($event)">Nestor Kirchner</div>
+4
2

:

$scope.doClick = function(event){

    var x = event.x;
    var y = event.y;
    var offsetX = event.offsetX;
    var offsetY = event.offsetY;

    // you have lots of things to try here, not sure what you want to calculate
    console.log(event, x, y, offsetX, offsetY);
};

HTML:

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

, ? ?

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

+5

mozilla firefox. mozilla,

var offsetX = event.originalEvent.layerX;
var offsetY = event.originalEvent.layerY;
0

More articles:


All Articles