AngularFire - выдвигает данные из запроса коллекции пожарного хранилища в массив - PullRequest
Новая
       32

AngularFire - выдвигает данные из запроса коллекции пожарного хранилища в массив

0 голосов
/ 11 декабря 2018

Я запрашиваю коллекцию Firestore для успешного получения результатов.Тем не менее, я использую сортируемый угловой плагин, для сортировки которого требуется массив.

Проблема, с которой я столкнулся, заключается в том, что элементы помещаются в массив, но я не могу найти правильное местоположение для очистки массива при поступлении новых элементов. Без очистки массива возвращаемые результаты начинают дублироваться вмассив.

Может ли кто-нибудь помочь с рефакторингом приведенного ниже кода, чтобы я мог успешно перенести результаты сбора в массив и очистить его в нужном месте, пожалуйста? 

...
itemsArray = []
...

getData(){
    this.issueCollection = this.afs.collection<any>(`users/${user}/projects/${project}/issues`, ref => {
      return ref.orderBy('order');
    });
    this.issues = this.issueCollection.snapshotChanges().pipe(
      map(actions => actions.map(a => {
        const data = a.payload.doc.data();
        const id = a.payload.doc.id;

        this.itemsArray.push({ id, ...data });

        return { id, ...data };
      }))
    );
  }

HTML - Как мне нужен HTML для отображения результатов 

<ul>
   <li *ngFor="let issue of itemsArr">
      {{ issue.issueName }}
   </li>
</ul>

Обновление - Кажется, это работает 

  getData(){
    this.issueCollection = this.afs.collection<any[]>(`users/${user}/projects/${project}/issues`, ref => {
      return ref.orderBy('issue_order');
    });
    this.issues = this.issueCollection.snapshotChanges().pipe(
      map(actions => {
      this.itemsArr = [];
      return actions.map(a => {

        const data = a.payload.doc.data();
        const id = a.payload.doc.id;


        this.itemsArr.push({ id, ...data });


        return { id, ...data };
      });
    }))
  }

1 Ответ

0 голосов
/ 11 декабря 2018

Что бы я сделал, это заставил бы его подписаться на коллекцию и сделать это: 

getData(){
    this.issueCollection = this.afs.collection<any[]>(`users/${user}/projects/${project}/issues`, ref => {
      return ref.orderBy('order');
    });
    this.issues = this.issueCollection.snapshotChanges().pipe(
      map(actions => actions.map(a => {
            const data = a.payload.doc.data();
            const id = a.payload.doc.id;

            return { id, ...data };
        }))).subscribe((items: any[]) => {
          this.itemsArray = [];
          this.itemsArray = items;
       });
  }

Это позволит вам очистить itemsArray и пополнить его.Вместо того, чтобы только толкать массив и никогда не очищать его.

...