apperyio, ionic5, input[type=file], load image asset to the image

Question

I'm trying to load an image from the input[type=file] to the image on a page. Is it possible to do it without uploading a file to the database?

More info about what i need

` ` and ..ts file `onFileInput(event: any) { let file = event.target.files[0]; let file url = URL.createObjectURL(file); }` — Ravi Ashara, Feb 10 '22 at 07:43
Thank you, it helped me a lot. Ill post a ready solution in below for others. — John802, Feb 11 '22 at 03:10

score 3 · Answer 1 · answered Feb 11 '22 at 03:44

Here is a solution for this, i've got with a help of Ravi(thanks to him).

1 Create a "fileURL" variable. How to do it

2 On image set "src" attribute with value of "{{fileURL}}". How to do it

3 Click on "file" and add "change" evet -> run typescript, with code How to do it:

//event.target.firstChild - is an input.
let file = event.target.firstChild.files[0];

if(file)
    this.fileURL = URL.createObjectURL(file);

apperyio, ionic5, input[type=file], load image asset to the image

1 Answers1