CODEWITHSUNDEEP
angulartypescriptionic2
Sireini
Sireini

Reputation: 4262

Ionic 2 - Proper way to show video

Is there a proper way of including videos in the ionic pages? Because when I use the html 5 video element the buttons are not usable when fullscreen.

<video id="video1" width="100%" preload="metadata" controls webkit-playsinline>
      <source type="video/mp4" src="http://www.w3schools.com/html/mov_bbb.mp4"/>
      <source type="video/ogg" src="http://www.w3schools.com/html/mov_bbb.ogg"/>
      Your browser does not support HTML5 video.
</video>

Is there any proper way of including videos in ionic2?

Upvotes: 1

Views: 1035

Answers (3)

Sampath
Sampath

Reputation: 65870

You can do it as shown below.

<ion-content overflow-scroll="true">
  <video controls="controls" preload="metadata" autoplay="autoplay" webkit-playsinline="webkit-playsinline" class="videoPlayer">
   <source src="http://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4" />
  </video>
</ion-content>

Working Code Pen sample

Upvotes: 1

Christian Benseler
Christian Benseler

Reputation: 8065

Can't you use Video Player from Ionic Native?

https://ionicframework.com/docs/native/video-player/

Upvotes: 0

Jamil
Jamil

Reputation: 939

I suggest to use file-opener2 plugin which allow you to open any kind of files in the default applications on the device, check the usage https://ionicframework.com/docs/native/file-opener/ but make sure that you have installed @ionic-native/core

Upvotes: 0

Related Questions