在 AngularJS 中获取点击输入的位置

Question

我想知道使用ng-click输入框的位置。以下是我在其中安慰事件 pageX 和 clientX 的控制器代码，但不是给出输入元素的位置，而是根据鼠标单击给出值。让我知道是否有属性可用于提取此信息。（顺便说一句，我不是在寻找指令方式）

控制器代码 -

myApp.controller('mainCtrl', function($scope){
  $scope.clicked = function(e) {
    console.clear();
    console.log(e);
    console.log(e.pageX);
    console.log(e.clientX);
  };
})

HTML代码-

<input type="text" ng-click="clicked($event)" />

工作计划 - http://plnkr.co/edit/f9HoVeSUwKUe9QSOB2jC?p=preview

Answer 1

Use Element.getBoundingClientRect() over e.target

Event.target: 对调度事件的对象的引用。

Element.getBoundingClientRect() 方法 returns 元素的大小及其相对于视口的位置。

var myApp = angular.module('app', []);
myApp.controller('mainCtrl', function($scope) {
  $scope.clicked = function(e) {
    console.log(e.target.getBoundingClientRect());
  };
})

<script src="http://gh-canon.github.io/stack-snippet-console/console.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js"></script>
<div ng-app="app" ng-controller="mainCtrl">
  <input type="text" ng-click="clicked($event)" />
</div>

Answer 2

简单！ :)

myApp.controller('mainCtrl', function($scope){
  $scope.clicked = function(e) {
    var el = e.currentTarget;
    var place = el.getBoundingClientRect();
    console.log(place);
    console.log('X coordinate - '+place.x);
    console.log('Y coordinate - '+place.y);
  };
})

在 AngularJS 中获取点击输入的位置

Get the position of an input on click in AngularJS

javascript

html

angularjs

angularjs-ng-click