如何避免在angular上多次调用方法;s ng重复

How to avoid multlple times called method at angular's ng-repeat

本文关键字：方法 ng 重复 调用 何避免 angular      更新时间：2023-09-26

我已经编写了这段代码。但当我点击图片时，它调用了三次。它应该被调用一次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");
    };
};

foo（）在每次渲染li模板时都被执行（3次，因为您有3个图像），因为它被封装在｛｛｝｝中。

尝试

ng-click="foo()"

相反。

相关文章：