How to Build a Capacitor File Explorer with Ionic Angular

[@TheSaceone]

Today is my birthday so I will take this as a present since this is going to be very helpful for me! Thank you Simon!

[@galaxies_dev]

Next year special birthday episode? :D

[@TheSaceone]

@@galaxies_dev every episode is special Simon!

[@hassenmohammed3176]

Best, as always!

[@h.selcukbeyhan8252]

hi, for saving files, can you pick the target folder by using the device functionalities?

[@D4rkyInarvano]

how do you already added the files?

[@kyawzin1722]

with capacitor filesystem can build app that detect incoming new files?

[@testermobile834]

can you display the images in the html from the device?

[@glowingseal]

Hello! I'm making an app with Ionic 7 and Capacitor to save some CSV files and photos in the Documents folder, I requested legacy storage and other external storage permissions in the manifest and the app worked fine in Android versions up to 12, but in 13 the file access permissions are different (something about scoped storage) so it doesn't let me access the external storage just like that. I can't figure out how to grant the app permissions to write and read files in the external storage or in a specific folder of it, do you know how this can be done? The idea is to have the files available to the user so they can transfer them if they need to

[@testermobile834]

hi Simon, thanks for the tutorial, I am getting an error in loadDocuments function, property files doesnot exists on type void....at this.folderContent = folderContent.files.map, can you help me solve this

[@galaxies_dev]

Then your folder does not exist most likely!

[@D4rkyInarvano]

How did you fixed this?

[@rituchandna4268]

when i dwnload file as a zip having one video and one html then its get crashed can you help?

[@scottnewman2579]

So weird thing I found.... after I create a directory like TEST and delete it.. later if I create TEST again it won't copy files to it? I cleaned out trash but still get copy error ... android so far

[@kaspr1388]

Thanks for the tutorials, Simon! Was wondering if you could do a video explaining how to save images from the web to your camera roll on both iOS and Android? All of the packages I've found are outdated and no longer working, thank you!

[@galaxies_dev]

How exactly are you accessing the web from your app? Are you using an in-app-browser, or just in general any image inside your Ionic app?

[@kaspr1388]

@@galaxies_dev they are images being loaded in from the web (my app allows users to post pictures for others to view) and I want a “Save to Camera Roll” button. You’re awesome 😎

[@KK-rd5rx]

Great Tuto one more again Simon. May i ask you a suggestion? could you please show us how to upload file with an API?

[@galaxies_dev]

Yeah I'll add uploading files to my todo list :)

[@antoniofcable]

Thanks for the tutorial. May I implement on PWA applications ?

[@CodigoBinarioWeb]

Yes you can...Click on the demo link to see it in action :)

[@williamxsp]

Im creating an app that have a feature to upload files later. Should I use these approach? Copy the selected files to an application folder so I can upload it later?

[@galaxies_dev]

If it's not just "data" you need to upload but real files then yes, I'd recommend that approach and later upload them from your stored files!

[@williamxsp]

@@galaxies_dev thanks!

[@fengbai8949]

Thanks for your sharing, I am really happy to see your video, btw, can you share the full source code on git?

[@galaxies_dev]

Link to the code is in the description!

[@fengbai8949]

@@galaxies_dev Thanks.

[@luisfelipealamillacalixto5936]

😃🎉

[@josealeman3644]

you welcome
npm i @capacitor/filesystem
npm i @capacitor-blob-writer
npm i @ionic-native/core
npm i cordova-plugin-preview-any-file
npm i @ionic-native/preview-any-file