如何在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

了foo（）是每个李模板被渲染（3倍，你有3个图像），因为它包含在一次执行 { {}}。

尝试

ng-click="foo()" 

代替。