verschachtelte Sammlung Rückkehr von Fires als Objekt für angularfire2 und Feuerbasis

Question

die Sie die folgende Struktur Lassen Sie sagen haben:

shopping-carts (collection) 
- shopping-cart 1(doc) 
    -- dateCreated (field) 
    -- items (collection) 
- shopping-cart 2(doc 
    -- dateCreated 
    -- items 
. 
. 
. 

So, wie würden wir gehen über die gesamte Shopping-Cart (doc) als ShoppingCart Objekt bekommen, dass wir definiert als

export interface ShoppingCart { 
    items: ShoppingCartItem[] 
    dateCreated: string 
} 

afs.doc('shopping-cart/id').valueChanges() nur die Datecreated kehrt

afs.doc('shopping-cart/id').collection('items').valueChanges() die Elemente zurückgibt.

Einfache Möglichkeit, alles in einem zu erhalten und es als ein Objekt zu erstellen?

Answer 1

Wahrscheinlich nicht die beste Lösung, aber konnte noch keine bessere finden.

this.shoppingCartsCollection = afs.collection<Servicio>('shopping-carts', 
     ref => ref.orderBy('dateCreated', 'asc')); 

this.shoppingCarts = this.shoppingCartsCollection 
    .snapshotChanges() 
    .map(values => { 
     return values.map(value => { 

      const shopping-cart = value.payload.doc.data(); 
      const itemsArray = shopping-cart.items; 
      shopping-cart.observableItems = []; 

      for (var i = 0, len = itemsArray.length; i < len; i++) { 
      itemDocRef = itemsArray[i]; 
      value.observableItems.push(afs.doc('items/'+ itemDocRef.id).valueChanges()); 
      } 

      return shopping-cart; 
     }); 
    }); 

Zugriff auf Ihre Artikel Daten, wie jede andere beobachtbare

<div *ngFor="let shoppingCart of shoppingCarts | async"> 
    <p *ngFor="let observableItem of shoppingCart.observableItems"> 
     {{(observableItem | async)?.displayName}} 
    </p> 
</div>