RxJs,Angular4 +

时间:2018-10-08 08:39:34

标签: angular rxjs

我有一个film对象,它有一个genre属性。 我想在运行时在自定义下拉列表FormControl中按类型获取电影。

因此,我定义了new BehaviourSubject(<int>) genre,如果它将在运行时更改,请使用ngOnChanges()方法获取值。之后,它会到达API。但在此之前,我想检查流派值。例如,如果genre.getValue = 0不调用API。

示例代码如下。如何检查价值?

private _genre;
private selectedGenre = new BehaviorSubject(0);
@Input()
set genre(value: any) {
  this._genre = value;
  this.selectedGenre.next(this._genre);
}
films: any[];

ngOnInit() {
  this.selectedGenre.distinctUntilChanged().combineLatest(
      this.selectedGenre.distinctUntilChanged(), (_genre) => {
        return {
          genre: _genre
        }
      }
    )
    .switchMap(t => this.service.getFilmsByGenre(genre))
    .subscribe(result => {
      if (result) this.films = result;
    });
}

ngOnChanges(changes: { [propName: string]: SimpleChange }) {
  if (changes['genre']) {
    this.films = null;
    this.filmCtrl.setValue(null);
    this.selectedGenre.next(changes['genre'].currentValue || 0);
  }
}

1 个答案:

答案 0 :(得分:1)

您可以使用过滤器来仅订阅那些需要调用API的值。

this.selectedGenre.distinctUntilChanged().combineLatest(
      this.selectedGenre.distinctUntilChanged(), (_genre) => {
        return {
          genre: _genre
        }
      }
    )
    .filter(genre=>genre.getValue!==0)
    .switchMap(genre => this.service.getFilmsByGenre(genre))
    .subscribe(result => {
      if (result) this.films = result;
    });