列表中项的动态单击函数指令.快到了

Directive for a dynamic click function for items in a list... almost there

本文关键字:指令 函数 单击 动态 列表      更新时间:2023-09-26

我有一个列表,根据某些情况,当我单击一个项目时,需要调用不同的函数。

我发出了呈现列表模板的指令。正是在该指令上,我想指定单击项目时调用的函数。

controller..
  $scope.dataArray = dataFromService;
  $scope.showDetailsInModal = function(item) {
    // item is always undefined here :(
  }
<div my-list="dataArray" on-item-click="showDetailsInModal()"></div>
directive...
  scope: {
    data: '=myList',
    onItemClick: '&',
  },
  templateUrl: template.html

模板.html:

<ul>
  <li ng-repeat="item in data"
      ng-click="onItemClick(item)">
  </li>
</ul>

该函数被调用(是),但是传入参数的项在该函数中使用时是未定义的。我不知道为什么

感谢您的帮助,一直!

要将参数从指令传递给回调函数,请尝试执行以下更改。

模板.html:

<ul>
  <li ng-repeat="item in data"
      ng-click="onItemClick({argItem:item})">
  </li>
</ul>

您的主网页

<div my-list="dataArray" on-item-click="showDetailsInModal(argItem)"></div>

在这里,我们需要以对象的形式传递参数,并且该对象的键将与模板中分配的函数参数进行映射。

在 plunker 中检查这个工作示例,显示如何将参数传递给指令中的函数。

希望这会有用。