directive('mzIconTransform',['$timeout',function ($timeout) {
return {
scope: {
iconSrc1: '@',
iconSrc2: '@',
showFlag: '=',
clickFunc: '&'
},
restrict: 'EA',
replace: true,
transclude: true,
template: '<p><img src="{{iconSrc1}}" class="icon-button" ng-if="!showFlag" id="icon-off" /><img src="{{iconSrc2}}" class="icon-button" ng-if="showFlag" ng-click="clickFunc()" /></p>',
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里面的方法,所以我想要给p下的第一个img添加事件,但是在link函数中好像取不到子元素,有什么办法可以取到子元素同时给他绑定事件的吗
某草草2017-05-15 17:10:16
コンパイルでテンプレートを変更する
compile:function(iEle,iAttr){
//jquery テンプレートのiEle要素の下にあるimgタグを取得する
$('img',iEle).attr('someAttr','someValue' );/ /テンプレートの要素属性を変更すると、当然 ng-click も変更できます
}