将 ng-click 添加到离子项目中的所有 <img>

Question

我真的是 ionic 和 angular 的新手，我需要在每个 img 元素中添加 ng-click 属性。我尝试使用 $compile 但我总是遇到一些错误问题，例如

RangeError: Maximum call stack size exceeded

HTML

 <img src="img/VIyNbAJ8TbeAQQo6Nm3m_Pic1.PNG"  style="display: block; width: 100%; height: auto; margin-left: auto; margin-right: auto;">

controllers.js

.controller('modalCtrl', function($scope, $ionicModal, $compile) {

$ionicModal.fromTemplateUrl('templates/modal.html', {
    scope: $scope
}).then(function(modal) {
    $scope.modal = modal;
});

$scope.openModal = function (event) {
    $scope.modal.show();
    $scope.imgUrl = event.target.src;
}

directives.js

.directive('img', function ($compile) {
return {
    restrict: 'E',
    link: function (scope, element) {

        element.attr('ng-click', "openModal($event)" );

        $compile(element)(scope);
    }
};

如何自动在每个 img 中添加 ng-click？谢谢你。

Answer 1

无需编译 ng-click 指令，只需添加点击处理程序即可：

app.directive('img', function ($compile) {
return {
    restrict: 'E',
    link: function (scope, element) {

        //element.attr('ng-click', "openModal($event)" );
        //$compile(element)(scope);

        element.on("click", function(event) {
            scope.$eval("openModal($event)", {$event: event});
            scope.$apply();
        });
    }
};

将 ng-click 添加到离子项目中的所有 <img>

Add ng-click to all <img> in ionic project

angularjs

ionic-framework

angular-directive

ionic2