ionic on-slide - disable scroll

content.html

<ion-content class="has-header" direction="y" overflow-scroll="true">
		<div class="list">
			<div class="item">
				<ion-slide-box on-slide-changed="slideHasChanged($index)" class="h300" show-pager="true">
					<ion-slide ng-repeat="p in car.pictures" style="width:auto; !important" y-scroll-disable>
						<div class="box">
							<div style="height: 300px;
                                        background: url('{{p}}') no-repeat center center;
                                        -webkit-background-size: cover;
                                        -moz-background-size: cover;
                                        background-size: cover;">
							</div>
							<!--<img ng-src="{{p}}" style=""></img>-->
						</div>
					</ion-slide>
				</ion-slide-box>
			</div>
		</div>
</ion-content>

directive.js

.directive("yScrollDisable", function ($ionicScrollDelegate) {
		return {
			restrict: "A",
			link: function (scope, element, attrs) {
				function disable(){
					$ionicScrollDelegate.freezeScroll(true);
				}
				function enable(){
					$ionicScrollDelegate.freezeScroll(false);
				}
				element.on('mousedown',disable);
				element.on('touchstart',disable);

				element.on('touchend',enable);
				element.on('mouseup',enable);
				element.on('transitionend',enable);
				element.on('resize',enable);
			}
		};
	})