Отображать повторяющиеся события после обновления данных в хранилище, но сами данные в хранилище не дублируются

Question

У меня есть веб-приложение (Angular) и мобильное приложение (Ionic). Они оба используют одни и те же данные Firestore.

Используйте веб-приложение для обновления существующих данных, но в ионном приложении отображаются повторяющиеся элементы (дубликаты будут удалены после перезапуска мобильного приложения), я проверяю сами данные элемента в Firestore, они были обновлены и уникальны. У кого-нибудь есть подсказки по этому поводу?

Эта проблема возникает только в мобильном приложении, отличном от веб-приложения, оба они используют "angularfire2": "^5.0.0-rc.4",

   import { AngularFirestore, AngularFirestoreCollection } from 'angularfire2/firestore';

   this.posts$ = this.db.getRecentPosts().snapshotChanges().pipe(
      map(arr => arr.map(doc => {
          return { id: doc.payload.doc.id, ...doc.payload.doc.data() }
        }
      ))
    );

Провел исследование и похоже (не уверен на 100%) проблема angularfire2: AngularFirestoreCollection иногда возвращает дубликаты записей после вставки новой записи

Answer 1

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

 import { AngularFirestore, AngularFirestoreCollection } from 'angularfire2/firestore';

   this.posts$ = this.db.getRecentPosts().snapshotChanges().pipe(
      map(arr => arr.reduce((acc, doc) => { // map -> reduce
        const id = doc.payload.doc.id
        // remove !(id in acc) to get last duplicate
        !(id in acc) && acc[id] = { id, ...doc.payload.doc.data() } 
        return acc }
        }, {} // reduce seed
      )),
      // you can also Object.values(arr.reduce(...)), but this I find bit more readable
      map(coll => Object.values(coll))
    );