传递参数NG-点击指令，自定义指令中 [英] Passing parameter to ng-click directive, within custom directive

问题描述

我用 NG-重复模板自定义指令如下：

I'm using ng-repeat in the template for a custom directive as follows:

<li ng-repeat="image in images">
    <img ng-src="{{image.url}}" ng-click="togglePhoto({{$index}})">
</li>

在页面上呈现的源看起来像

When rendered on the page the source looks like

<li ng-repeat="image in images" class="ng-scope">
    <img ng-src="http://example.com/example.jpg" ng-click="togglePhoto(1)" src="http://example.com/example.jpg">
</li>

我具备的功能 togglePhoto 在我的指令定义。如果没有传递{{}指数} 参数，它的工作原理和功能调用。随着指数，它不火。

I have the function togglePhoto defined in my directive. Without the {{index}} parameter being passed in it works and the function is called. With the index, it doesn't fire.

我如何获得照片的索引点击进入 togglePhoto 功能？

How do I get the index of the photo clicked into the togglePhoto function?

推荐答案

想通了这一点。希望它可以帮助粘贴了别人。

Figured this out. Hope it helps anyone else stuck on it.

首先这种

ng-click="togglePhoto({{$index}})"

应

ng-click="togglePhoto($index)"

括号不需要！

其次我发现，你可以传递事件对象到点击的功能，例如

Secondly I found that you can pass the event object into the click function eg

ng-click="togglePhoto($event)"

然后捕获该事件，并找出哪些因素触发时它在你的点击功能

Then catch that event and find out what element trigged it in your click function

$scope.togglePhoto = function(e)
{
    console.log(e.currentTarget)
}

这篇关于传递参数NG-点击指令，自定义指令中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！