Вложенная подписка и все API должны передаваться в виде тела в виде тела - Angular 6 RxJS - PullRequest
0 голосов
/ 11 октября 2018

Я разрабатываю компонент таблицы, и данные для компонента таблицы должны быть заполнены на основе трех раскрывающихся значений.Мне нужно передать все три значения в API, чтобы получить желаемый ответ.Я могу добиться этого, используя вложенные подписки, что является очень плохим способом.но любое изменение вызывает API несколько раз.Как я могу это исправить?Большинство примеров, которые я нашел, предназначены для получения только окончательного значения подписки, но в моем случае мне нужны все три.Любой совет, чтобы добиться использования tap и flatMap?

Пожалуйста, совет.

    this._data.currentGroup.subscribe(bg => {
        this.bg = bg;

        this._data.currentUnit.subscribe(bu => {
            this.bu = bu;

            this._data.currentFunction.subscribe(jf => {
                this.jf = jf;

                this.apiService.getFunctionalData(this.bg, this.bu, this.jf)
                .subscribe(
                  (data) => {
                    console.log(data)
                  }
                );

            });
        });
    });

Это то, что я сделал.

    this._data.currentGroup.pipe(
        tap(bg => this.bg = bg),
        flatMap(bu => this._data.currentUnit.pipe(
            tap(bu => this.bu = bu),
            flatMap(jf => this._data.currentFunction.pipe(
                tap(jf => this.jf = jf)
            ))
        ))
    ).subscribe();

Это образецпример моего dataService.Я инициализирую свой dataservice в конструкторе компонента таблицы как _data.

    changeGroup(bg: string) {
      this.changeGroupData.next(bg);
    }

    private changeGroupData = new BehaviorSubject<string>('');
    currentChangeGroup = this.changeGroupData.asObservable();

1 Ответ

0 голосов
/ 11 октября 2018

Вы можете использовать ОбъединитьПоследние , чтобы объединить три Наблюдаемые, а затем подписаться на все сразу.Он выдаст новое значение, как только изменится одна из трех наблюдаемых.

combineLatest(this._data.currentGroup,
              this._data.currentUnit,
              this._data.currentFunction).subscribe(([bg, bu, jf]) => {
        // do stuff
      });

Например, посмотрите на демонстрацию stackblitz , которую я создал.

...