Question

是否可以将HTMLElement传递给控制器上配置的ng-click？

以下是一些示例代码：

<div ng-controller="Controller">
   <ul ng-repeat="item in items">
      <li ng-click="handleThisElement($element)" id="{{item.id}}" >{{item.name}}</li>
   </ul>
</div>

控制器：

function ($scope) {
  $scope.items = [
    {name: 'Bilbo', id='Bilbo'},
    {name, 'Frodo', id='Frodo'},
    {name: 'Pippin', id='Pippin'},
    {name: 'Merry', id='Merry'},
    {name: 'Sam', id='Sam'}
  ];

  $scope.handleThisElement = function (element) {
     alert(element.id); // should alert (Bilbo || Frodo || Pippin || Merry || Sam)
  }

更新：

不要混淆，我说我想让整个元素不仅仅是模型中的id。

$ event.target - 在某些版本的IE中不起作用。

Answer 1

HTML：

<div ng-controller="Controller">
   <ul ng-repeat="item in items">
      <li ng-click="handleThisElement($event)" id="{{item.id}}" >{{item.name}}</li>
   </ul>
</div>

和js：

function ($scope) {
  $scope.items = [
    {name: 'Bilbo', id='Bilbo'},
    {name, 'Frodo', id='Frodo'},
    {name: 'Pippin', id='Pippin'},
    {name: 'Merry', id='Merry'},
    {name: 'Sam', id='Sam'}
  ];

  $scope.handleThisElement = function ($event) {
     alert($event.target.id);
  }

Answer 2

handleThisElement(item);

以下是plunker

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

Answer 3

将<{1}}用于此

$watch

Answer 4

尝试

<div ng-controller="Controller">
   <ul ng-repeat="item in items">
     <li ng-click="handleThisElement(item)" id="{{item.id}}" >{{item.name}}</li>
   </ul>
</div>

function ($scope) {
   $scope.items = [
     {name : 'Bilbo', id:'Bilbo'},
     {name : 'Frodo', id:'Frodo'},
     {name : 'Pippin', id:'Pippin'},
     {name : 'Merry', id:'Merry'},
     {name : 'Sam', id:'Sam'}
   ];

   $scope.handleThisElement = function (element) {
    alert(element.id); // should alert (Bilbo || Frodo || Pippin || Merry || Sam)
   }
}

将当前的HTMLElement传递给ng-click

4 个答案: