I am implementing a gallery that consist of images and videos. When I click on an item in a gallery, the item is displayed in an ionic modal which has a ionic slide box. I am encountering a problem with youtube Iframe and ionic slidebox. If I open the video directly without using slide in ios safari and play it, it works fine but the moment I do a slide in the slide box and then play the video I don't know where is my touch event going as some times video is getting played after 10 hits or some time never. Its totally random. Following is the html code for my modal.html. This is working perfect in android and with all other browsers except ios safari.
<ion-slide-box show-pager="false" active-slide="currentIndex.value" on-slide-changed="slideChanged($index)">
<ion-slide ng-repeat="item in gallery" ng-click="toggleModalControls()">
<smart-img src="{{ item.image }}" class="fullscreen" ng-if="item.image"></smart-img>
<div id="{{item.uniqueId}}" class="youtube-wrapper" ng-if="item.video" ng-click="printMessage()">
<iframe width="100%" height="250" src="{{ item.video }}">
</iframe>
</div>
<text-overlay ng-show="showModalControls">
<p>{{ item.description }}</p>
</text-overlay>
</ion-slide>
</ion-slide-box>