AckerApple / angular-file

Angular components for user file select, drop, and more
http://ackerapple.github.io/angular-file/
MIT License
128 stars 40 forks source link

pre-play video before uploading it to the server #84

Open carrie-xin opened 4 years ago

carrie-xin commented 4 years ago

i want to play video before uploading it to the server, ngfBackground works fine for preview images ,but how about videos?

AckerApple commented 4 years ago

Build me any example with vanilla JavaScript and implement

_Acker Apple

On May 29, 2020, at 3:47 AM, carrie-xin notifications@github.com wrote:

 i want to play video before uploading it to the server, ngfBackground works fine for preview images ,but how about videos?

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub, or unsubscribe.

carrie-xin commented 4 years ago
// preview image
<button ngfSelect accept="image/*"  [(file)]="imageFile" (fileChange)="changeImage()">
  select image
</button>
<div [ngfBackground]="imageFile"></div>

// play video ?
<button  ngfSelect accept="video/*" [(file)]="videoFile" (fileChange)="changeVideo()">
  select video
</button>

// this not working
<video controls autoplay >
  <source [ngfSrc]="videoFile">
</video>

@AckerApple i just want to play video with source file, because it takes too much time to upload videos to the server. Do you have a solution? thanks

AckerApple commented 4 years ago

Hey that’s not vanilla javascript

I’ve not had the need before to have a video preview during file upload so I do not off hand know what code to write. I know it’s not hard and docs exist it’s just I am busy elsewhere.

If you can build and example of how to use a selected file As a video preview or give me links to super easy docs, I can then implement into this package for tou

carrie-xin commented 4 years ago

@AckerApple I've solved this problem by FileReader , thank you all the same😄

AckerApple commented 4 years ago

Make the world a better place and share me your solution or a link to where you learned how to do so I can implement in the future

carrie-xin commented 4 years ago

@AckerApple Here example with Pre-play video