将数组或对象添加到Firestore文档

时间:2018-09-21 20:40:01

标签: angular typescript firebase google-cloud-firestore angularfire2

如何将数组或对象添加到Firestore文档中?

我正在将图像上传到Firestore文档,以下代码上传图像但在子集合archivos中,如何上传这些相同图像但在同一文档的数组或对象中,例如在字段imagenes

这是我目前拥有的:

enter image description here


enter image description here

crear-proyecto.component.html

<form #f="ngForm" [formGroup]="forma" (ngSubmit)="cargarImagenes()" novalidate> 

crear-proyecto.component.ts

  forma: FormGroup;
  @ViewChild('f') form; 
  estaSobreElemento = false;
  archivos: FileItem[] = [];
  imagenes: FormArray;

constructor( private fb: FormBuilder, private fs: FirebaseService, public snackBar: MatSnackBar, private storage: AngularFireStorage, public _cargaImagenes: CargaImagenesService ) { 
  this.forma = fb.group ({
    categoria: [ '', Validators.required ],
    cliente: [ '', Validators.required],
    titulo: [ '', Validators.required ],
    textoDestacado: [ '', Validators.required ],
    descripcion: [ '', Validators.required ],
    imagenDestacada: [ '' ],
    fecha: [ firebase.firestore.FieldValue.serverTimestamp() ],
    imagenes: this.fb.array([this.createItem()])
  })
}

createItem(): FormGroup {
  return this.fb.group(this.archivos);
}

cargarImagenes() {
  this._cargaImagenes.cargarImagenesFirebase( this.archivos, this.forma.value );
}

cargar-imagenes.service.ts

fileId = this.db.collection('proyectos').ref.doc().id;
  myFolder = 'archivos';

  constructor(private db: AngularFirestore) { }   
  cargarImagenesFirebase(imagenes: FileItem[], myDataForm) {   
    const storageRef = firebase.storage().ref();   
    for (const item of imagenes) {
      item.estaSubiendo = true;
      if (item.progreso >= 100) {
        continue;
      }

      const uploadTask: firebase.storage.UploadTask =
        storageRef.child(`${this.myFolder}/${item.nombreArchivo}`)
          .put(item.archivo);

      uploadTask.on(firebase.storage.TaskEvent.STATE_CHANGED,
        (snapshot: firebase.storage.UploadTaskSnapshot) =>
          item.progreso = (snapshot.bytesTransferred / snapshot.totalBytes) * 100,
        (error) => console.error('Error al subir', error),
        () => {
          console.log('Imagen cargada correctamente');
          uploadTask.snapshot.ref.getDownloadURL().then((downloadURL) => {
            item.url = downloadURL;
            item.estaSubiendo = false;
            this.guardarImagen({
              nombre: item.nombreArchivo,
              url: item.url
            }, myDataForm);
          });
        });
    }
  }


  guardarImagen( imagen: { nombre: string, url: string }, myDataForm ) {
    const proyecto = this.db.collection('proyectos').doc(`${this.fileId}`);
    proyecto.collection(`${this.myFolder}`).add(imagen);
    proyecto.set(myDataForm)

    console.log(this.fileId)
  }

有什么想法要实现吗?

0 个答案:

没有答案