Skip to content

Instantly share code, notes, and snippets.

@jamesdaniels
Last active March 23, 2018 10:44
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jamesdaniels/1f378deebe9e98452a6a9b9a3fbefce0 to your computer and use it in GitHub Desktop.
Save jamesdaniels/1f378deebe9e98452a6a9b9a3fbefce0 to your computer and use it in GitHub Desktop.
Usage of my `AngularFireStorage` service, https://github.com/jamesdaniels/angularfire2/tree/storage
import { Component } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Subscription } from 'rxjs/Subscription';
import * as firebase from 'firebase/app';
import { AngularFireAuth } from 'angularfire2/auth';
import { AngularFireStorage } from 'angularfire2/storage';
@Component({
selector: 'app-upload',
templateUrl: './upload.component.html',
styleUrls: ['./upload.component.css']
})
export class UploadComponent {
task: FirebaseUploadTaskObservable<firebase.storage.UploadTaskSnapshot>;
state: Observable<String>;
uploading: Observable<Boolean>;
success: Observable<Boolean>;
percentage: Observable<number>;
constructor(private afAuth: AngularFireAuth, private storage: AngularFireStorage) { }
upload(event) {
const file = event.srcElement.files[0];
this.task = this.storage.upload(`/uploads/${file.name}`, file, {
customMetadata: {
uid: this.afAuth.auth.currentUser.uid
}
});
this.state = task.map(s => s.state);
this.uploading = state.map(s => s === firebase.storage.TaskState.RUNNING);
this.success = state.map(s => s === firebase.storage.TaskState.SUCCESS);
this.percentage = task.map(s => s.bytesTransferred / s.totalBytes * 100);
}
pause(event) {
task.pause();
}
resume(event) {
task.resume();
}
cancel(event) {
task.cancel();
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment