Отфильтровать транслируемую собственность в Angular 9 - PullRequest
0 голосов
/ 04 августа 2020

У меня есть dbService, который вызывает базу данных!

// Код службы БД -----------------------

 private changedEvents = new BehaviorSubject<IEvent[]>(null);
  broadCastEvents = this.changedEvents.asObservable();

  getEvents() {
    this.http.get<IEvent[]>(this.configUrl + 'Event/GetEvents').subscribe(
      (data: IEvent[]) => {
        this.changedEvents.next(data)
      });
  }

В моем компоненте на ngOnInit я начинаю слушать это

  ngOnInit(): void {
    this.dbService.broadCastEvents.subscribe(data => {
      this.events = data;
    })
   // this.dbService.getEvents();
  }

Теперь все это работает как шарм! Но теперь меня интересуют только записи, в которых this.events.type == 2

Я пробовал использовать стандартную фильтрацию, как показано ниже!

  ngOnInit(): void {
    this.dbService.broadCastEvents.subscribe(data => {
      this.events = data.filter(event => event.eventTypeRefId == 2);
    })
   // this.dbService.getEvents();
  }

Но это приводит к следующей ошибке! ? Есть идеи, как это лучше сделать (это работает: -))

core.js:6241 ERROR TypeError: Cannot read property 'filter' of null
    at SafeSubscriber._next (start-training.component.ts:26)
    at SafeSubscriber.__tryOrUnsub (Subscriber.js:183)
    at SafeSubscriber.next (Subscriber.js:122)
    at Subscriber._next (Subscriber.js:72)
    at Subscriber.next (Subscriber.js:49)
    at BehaviorSubject._subscribe (BehaviorSubject.js:14)
    at BehaviorSubject._trySubscribe (Observable.js:42)
    at BehaviorSubject._trySubscribe (Subject.js:81)
    at BehaviorSubject.subscribe (Observable.js:28)
    at Observable._subscribe (Observable.js:76)

Ответы [ 2 ]

1 голос
/ 04 августа 2020
ngOnInit(): void {
  this.dbService.broadCastEvents.pipe(filter(event => event.eventTypeRefId == 2)).subscribe(data => {
    this.events = data
  })
 // this.dbService.getEvents();
}

Ссылка: https://rxjs-dev.firebaseapp.com/guide/operators

0 голосов
/ 04 августа 2020

Есть несколько способов. Один из способов - использовать массив filter, как и вы. Другой способ - использовать канал Rx JS filter, как показано @ enno.void. Однако оба этих метода могут по-прежнему вызывать ошибку, если уведомление имеет номер null. И поскольку значение по умолчанию вашего BehaviorSubject равно нулю, высока вероятность повторного появления ошибки.

Одним из способов решения этой проблемы является использование ReplaySubject с буфером 1 вместо этого. Он похож на BehaviorSubject в том, что он хранит / буферизует последнее выданное значение и выдает его сразу после подписки, за исключением того, что значение по умолчанию не требуется. Таким образом, отпадает необходимость в начальном значении null.

Попробуйте следующее

private changedEvents = new ReplaySubject<IEvent[]>(1);
broadCastEvents = this.changedEvents.asObservable();
...

Теперь ошибка все равно может возникнуть, если вы выбрали pu sh null или undefined к наблюдаемому. Таким образом, в условии фильтра вы также можете проверить истинность значения.

ngOnInit(): void {
  this.dbService.broadCastEvents.subscribe(data => {
    this.events = data.filter(event => {
      if (event) {
        return event.eventTypeRefId == 2;
      }
      return false;
    });
  });
}
...