Upload Files from Angular to Firebase Storage

From the creator

UPDATE Watch the latest store video here: https://youtu.be/wRWZQwiNFnM Full Lesson: https://angularfirebase.com/lessons/angular-file-uploads-to-firebase-storage/ In this episode we are going to implement file uploads with Angular and Firebase Storage. File storage is currently unsupported in the AngularFire2 package, but it's still possible to use Firebase storage by interacting directly with the Firebase Web API. We're still going use AngularFire2 for saving information about file uploads to the realtime database, such as the file name and its URL location. Step 1 - Generate the Files The structure of this feature is very similar to the Angular Firebase CRUD lesson, so make sure to check that out. It is just form that accepts files, uploads them to the storage bucket, then renders the details to a list. ng g service uploads/shared/upload ng g class uploads/shared/upload ng g component uploads/uploads-list ng g component uploads/upload-detail ng g component uploads/upload-form Step 2 - Define the Upload Class The upload class will be used by the service. Notice it has a constructor for the `file` attribute, which has a type of `File`. This class is built into JavaScript and it defines files that are passed via HTML from inputs. Step 3 - Build the Upload Service The service needs to upload the file to Firebase Storage then save details about the file to the realtime database. First let's add the necessary imports import, including the Firebase API, and declare the

Published 2017-04-19 · Watch on YouTube ↗
Availability and playback restrictions are controlled by the original channel.