javascript - 如何避免在 Angular 的 ng-repeat 中多次调用方法

Question

我已经写了这段代码。但是当我单击图像时，它调用了三次。它应该被调用一次 foo() 方法。你知道吗？

<div ng-controller="photoCtrl">

        <img ng-src="{{currentImg.path}}" class="current-img"></img>
        <p>
        <ul>
            <li ng-repeat="image in images" class="thumb-list">
            <img ng-src={{image.path}}/ class="thumb" ng-click={{foo()}}></img>
            </li>

        </ul>

</div>

PhotoCtrl 在这里...

var photoCtrl = function($scope){
    $scope.images = [
        {"path":"img/a.jpeg"},
        {"path":"img/b.jpeg"},
        {"path":"img/c.jpeg"}
    ];
    $scope.currentImg = _.first($scope.images);

    $scope.foo = function(){
        console.log("Called");
    };

    $scope.setCurrentImg = function(item){
        console.log("callellellellellle");
    };

};

Answer 1

每次渲染 li 模板时都会执行foo() （因为它包含在 {{ }} 中，所以有 3 张图像时会执行 3 次）。

尝试

ng-click="foo()"

反而。