AngularFire - Firestore - Как получить суб-коллекцию и объединить в HTML - PullRequest
0 голосов
/ 16 мая 2019

В данный момент у меня есть сценарий, в котором у меня есть набор проблем, которые я успешно получил. В firestore каждый выпуск (issues > issueID) имеет подколлекцию под названием images.

В этой коллекции есть ID документа на изображение. (issues > issueID > images > imageID). У меня есть страница, на которой отображаются все проблем, и я хотел бы также показать все связанные изображения для каждой проблемы.

В своем HTML ниже я добавил комментарий о том, куда я хотел бы добавить изображения проблемы.

Желаемый результат:

  • выпуск 1
    • Выпуск 1, изображения
  • выпуск 2
    • Выпуск 2 изображения

и т.д.

Получить вопросы

 this.issuesCollection = this.afs.collection<any>(`users/${this.userID}/projects/${this.project_id}/issues`, ref => ref.orderBy('issue_order'));
      // this.issues = this.issuesCollection.valueChanges();   
      this.issues = this.issuesCollection.snapshotChanges().pipe(
        map(actions => actions.map(a => {
          const data = a.payload.doc.data();
          const id = a.payload.doc.id;
          return { id, ...data };
        }))
      );

HTML

<ul>
   <li *ngFor="let issue of issues | async">
      {{issue.issue_title}}
      <ul>
         <li>
             <!-- THIS IS WHERE I WOULD LIKE THE IMAGES PER ISSUE TO GO -->      
         </li>
      </ul>
    </li>
</ul>

Справочник по коллекциям изображений Это расположение изображений, где id будет идентификатором проблемы. Это не было подключено, но там, где будут расположены изображения.

this.imagesCollection = this.afs.collection<any>(`users/${this.userID}/projects/${this.project_id}/issues/${id}/images`);
this.images = this.imagesCollection.snapshotChanges()

1 Ответ

0 голосов
/ 19 мая 2019

В Firebase появилась новая функция Запрос группы сбора , которая определенно может помочь в вашем случае.Но, к сожалению, я не думаю, что это уже реализовано в angularfire2.

Вы можете использовать RxJS MergeMap

  const collection = this.firestore.collection('users');
  return  collection.valueChanges.pipe(
    mergeMap( (users: User[]) =>  
               this.firestore.doc(`stories/${users[0].uid}`).
                        valueChanges().pipe(map(
                          (storie) => Object.assign({}, {users[0].uid, ...users[0], ...stories}
                      ))
           ))
   );
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...