title: How do I read mouse position in angularjs when a click is made?
body: <p>I want to get the in-element (x, y) position of a <code>ng-click</code>ed element. Using <code>clientX</code> and <code>clientY</code> gets transformed by the page scroll. Using <code>pageX</code> and <code>pageY</code> is not scroll-dependent, but it is absolute. Those four properties belong to the <code>$event</code> object, available inside the <code>ng-click</code> directive. How would I calculate the in-element x and y?</p>
  
  <p>In jQuery I'd do something like:</p>
  
  <pre><code>$("#something").click(function(e){
      var parentOffset = $(this).parent().offset(); 
      //or $(this).offset(); if you really just want the current element's offset
      var relX = e.pageX - parentOffset.left;
      var relY = e.pageY - parentOffset.top;
  });
  </code></pre>
  
  <p>But now, I want to do it in angularjs (i.e. inside a <code>controller</code>, <strong>not</strong> inside a postLink function). What is a good way to do it? Is it safe to do the same but using <code>angular.element</code>? Or is there another way of calculating the values I need?</p>
  
  <p><strong>Edit</strong> Clarifying: In a controller, I'd try:</p>
  
  <pre><code>$scope.onClick = function($event) {
      //currently I can...
      var pageX = $event.pageX;
      var pageY = $event.pageY;
  };
  </code></pre>
  
  <p>But I need to transform those coordinates to clicked-element related coordinates, since those elements are absolute. Consider an appropiate HTML:</p>
  
  <pre><code>&lt;div ng-click="onClick($event)"&gt;Nestor Kirchner&lt;/div&gt;
  </code></pre>