Angular огонь: получить ключи, значения из карты в документе как наблюдаемые

Question

Это документ моего пожарного магазина. Я хочу получить список комментариев к наблюдаемой, подписаться на это и перебирать комментарии. Как это сделать, используя angular огонь? Я новичок здесь, поэтому я был бы очень благодарен вам, если бы вы могли объяснить это подробно

Спасибо!

Answer 1

В вашем файле component.ts

doc: issue;
doc_comments: Array<string>;
ngOnInit() {
    db.collection('Agriculture_and_cropes').doc<issue>('doc_Id').valueChanges().subscribe(data => {
        this.doc = data;
        this.doc_comments = Array.from( data.comments.keys() );
    });
}

В вашем компоненте. html

<ul *ngIf="doc_comments">
    <li *ngFor="let c of doc_comments">
        {{c}} : {{doc.comments[c]}}
    </li>
</ul>

Answer 2

Что вы можете сделать, это создать наблюдаемый для документа, который выдает данные документа, когда есть изменение. Затем подпишитесь на эту заметку, чтобы получать данные и отображать их в своем html. Вот краткий пример, который можно улучшить.

app.component.ts

import {Component} from '@angular/core';
import {AngularFirestore} from '@angular/fire/firestore';
import {Observable} from 'rxjs';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  doc$: Observable<any>;
  collection = 'Agriculture_and_cropes';
  docId = 'Replace by your document Id';

  constructor(db: AngularFirestore) {
    this.doc$ = db.collection(this.collection).doc(this.docId).valueChanges();
  }

}

app.component. html

<ul *ngIf="doc$ | async as doc">
  <li *ngFor="let comment of doc.comments">
    {{comment.name}} : {{comment.desc}}
  </li>
</ul>