0
기본 AngularJS가 아닌 다른 라이브러리없이 이미지 회전식 지시문을 작성하고 있습니다.AngularJS : 컨트롤러에서 지시어의 DOM 요소에 액세스하십시오.
simpleCarousel.$inject = [];
function simpleCarousel() {
var directive = {
restrict: 'E',
templateUrl: 'someurl.html',
scope: {
// Scope variables
},
controller: simpleCarouselController,
controllerAs: 'ctrl',
bindToController: true
};
simpleCarouselController.$inject = [];
function simpleCarouselController() {
angular.extend(this, {
next : //handle next image sliding
prev : //handle previous image sliding
});
function detectSwipe(el) {
var touchsurface = el,
swipeDirection,
startX,
distX,
threshold = 150,
allowedTime = 2000,
elapsedTime,
startTime;
touchsurface.addEventListener('touchstart', function(e) {
var touchObject = e.changedTouches[0];
swipeDirection = 'none';
distX = 0;
startX = touchObject.pageX;
startTime = new Date().getTime();
e.preventDefault();
}, false);
touchsurface.addEventListener('touchmove', function(e) {
e.preventDefault();
}, false);
touchsurface.addEventListener('touchend', function(e) {
var touchObject = e.changedTouches[0];
distX = touchObject.pageX - startX;
elapsedTime = new Date().getTime() - startTime;
if (distX > 0) {
swipeDirection = 'right';
return swipeDirection;
} else if (distX < 0) {
swipeDirection = 'left';
return swipeDirection;
} else {
return false;
}
}, false);
}
}
}
나는 터치 이벤트에 대한 이벤트 처리기를 작성했습니다. 하지만 터치 이벤트에 요소를 전달하려면 어떻게해야합니까? 또한 JS를 사용하여 슬라이딩 또는 CSS 사용자 선택 속성에서 사용자 클릭 방지를 처리해야합니까?
당신이 인수로이 지시어는 – Dario
@Dario 일치하는 요소가 어디 당신은, 지시어의'''link''' 기능을 사용할 수 있습니다 우리는 지시어뿐만 아니라 링크 기능 및 컨트롤러를 선언 할 수 있습니다? –
예, 하나의 지시문에 컴파일, 링크 및 컨트롤러 기능이있을 수 있습니다. 링크 함수는 DOM을 수정하고 이벤트 리스너를 첨부해야하는 곳입니다. – Dario