angular指令中如何给模板中的子元素绑定事件？

Question

directive('mzIconTransform',['$timeout',function ($timeout) {
    return {
        scope: {
            iconSrc1: '@',
            iconSrc2: '@',
            showFlag: '=',
            clickFunc: '&'
        },
        restrict: 'EA',
        replace: true,
        transclude: true,
        template: '<div><img src="{{iconSrc1}}"  class="icon-button" ng-if="!showFlag" id="icon-off" /><img src="{{iconSrc2}}" class="icon-button" ng-if="showFlag" ng-click="clickFunc()" /></div>',
        link: function (scope, element, attr) {
            var elemChildren = element.children();
            element.bind('touchstart', function () {
                scope.$apply(function () {
                    scope.showFlag = true;
                });
                console.log("touchstart事件触发");
            });
            element.bind('touchend', function () {
                scope.$apply(function () {
                    scope.showFlag = false;
                });
                console.log("touchend事件触发");
            });
        },
    };
}] );

我想要的功能是触摸图片后，图片会变成另一张，触摸结束后又换回来，同时调用ng-click里面的方法，所以我想要给div下的第一个img添加事件，但是在link函数中好像取不到子元素，有什么办法可以取到子元素同时给他绑定事件的吗

Answer 1

element.find('img')[0]能拿到吧？

Answer 2

在compile中修改模板
compile:function(iEle,iAttr){
//jquery 获取模板iEle元素下的img标签
$('img',iEle).attr('someAttr','someValue');//修改模板某个元素属性，自然可以修改ng-click
}

Answer 3

你好 请问你这个问题解决了吗 求解