在custom指令中将参数传递给ng-click指令

mar*_*wie 14 angularjs angularjs-directive

ng-repeat在模板中使用自定义指令,如下所示:

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

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

<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>
Run Code Online (Sandbox Code Playgroud)

我有togglePhoto我的指令中定义的函数.如果没有{{index}}传入参数,它就可以工作并调用该函数.使用索引,它不会触发.

如何获取单击该togglePhoto功能的照片索引?

mar*_*wie 37

想出这个.希望它可以帮助其他人坚持下去.

首先是这个

ng-click="togglePhoto({{$index}})"
Run Code Online (Sandbox Code Playgroud)

应该

ng-click="togglePhoto($index)"
Run Code Online (Sandbox Code Playgroud)

不需要支架!

其次,我发现你可以将事件对象传递给click函数,例如

ng-click="togglePhoto($event)"
Run Code Online (Sandbox Code Playgroud)

然后捕获该事件并找出在您的单击函数中触发它的元素

$scope.togglePhoto = function(e)
{
    console.log(e.currentTarget)
}
Run Code Online (Sandbox Code Playgroud)