Если наблюдаемые данные из Angularfire2 превышают лимит, удалите самое старое значение из массива и базы данных - PullRequest
Новая
       30

Если наблюдаемые данные из Angularfire2 превышают лимит, удалите самое старое значение из массива и базы данных

0 голосов
/ 25 июня 2018

Я создаю кладку в реальном времени для изображений, используя Angularfire2 и Firebase.Я установил максимальный предел для того, сколько историй должно отображаться в html. Желаемое поведение: Данные поступают с firebase с помощью angularfire2 в режиме реального времени внешнего интерфейса (работает).Данные хранятся в массиве объектов, который отображается в html (работает).
Если новые данные, полученные в потоке, превышают лимит (рабочий), запустите функцию, чтобы вытолкнуть последний элемент в массиве и удалить его из базы данных (не работает).Таким образом, предполагая, что предел равен 5: если наблюдается объект № 6, удалите последний индекс из массива, сделав объект № 6 первым объектом в индексе массива.

Получение данных из службы: 

public get curatedStoriesFromDB(): Observable<any> {
    const dbRef = this.db.list<any>(this.dbBaseRef,
      ref => ref.orderByChild('isMarked').equalTo(true).limitToLast(100));
    return dbRef.valueChanges();
  }

Возвращает мне наблюдаемое, на которое я подписываюсь в моем фид-компоненте: 

dbData = new BehaviorSubject<any>(null);
storiesData = this.dbData.asObservable();

const dbRef = this.dbSrv.curatedStoriesFromDB
  .pipe(catchError(err => of(err)))
  .subscribe((data) => {
    this.dbData.next(data);
    console.log(this.dbData.getValue())
    //the code to check if the limit is exceeded
    if (data.length > (this.maxStories + 2)) {
      console.log('Too many stories')
      this.resetArraySize(data);
    }
  })

И функция ограничения: 

resetArraySize(stories: any[]) {
    const $stories = stories;
    while ($stories.length > (this.maxStories + 2)) {
      const shifted = $stories.pop();
      this.dbSrv.removeStoryFromFeed(shifted);
      this.dbData.next($stories)
    }
    return $stories;
  }

Я разворачиваю данныев моем HTML компоненте так: 

...*ngFor="let story of (storiesData | async); let i = index;" id={{i}};>

1 Ответ

0 голосов
/ 25 июня 2018

Предел должен обрабатываться автоматически предложением .limitToLast (100).Получаемый вами массив не должен превышать этот предел.

Однако, если вам нужен более точный контроль зерна, рассмотрите возможность использования .stateChanges и обработки событий child_added, child_removed и child_changed.Вы уменьшите объем данных, передаваемых назад и вперед между вашим клиентом и firebase.

список angularfire2

Кроме того, вы отправляете this.dbData несколько раз, что можетвызвать проблемы с производительностью и привести к путанице при отладке.Сначала уменьшите размер массива, а затем просто создайте его один раз.

...