Как связать подписку на BehaviorSubject <boolean>? - PullRequest
Новая
       8

Как связать подписку на BehaviorSubject <boolean>?

0 голосов
/ 31 августа 2018

У меня есть приложение Angular, которое показывает и скрывает поле ввода в зависимости от содержимого другого поля ввода. Теперь мне нужно сделать несколько автоформатировок во втором поле, когда пользователь что-то вводит в него. Но поле скрыто при загрузке компонента, поэтому мне нужно проверить значения первого поля, чтобы проверить, должно ли отображаться второе, а затем, когда оно видно, подписаться на его valueChanges.

Мой код выглядит так: 

export class MyInputComponent implements AfterViewInit {
  private subscription = Subscription.EMPTY;

  @ViewChild('firstInput', { read: NgControl }}
  public firstInput: NgControl;

  @ViewChild('secondInput', { read: NgControl }}
  public secondInput: NgControl;

  public isSecondInputVisible = new BehaviorSubject<boolean>(false);

  public ngAfterViewInit() {
    this.firstInput.valuesChanges!.subscribe((first) => {
      this.isSecondInputVisible.next(first.length > 4);
    });

    this.isSecondInputVisible.subscribe((isVisible) => {
      if (isVisible) {
        this.subscription = this.secondInput.valueChanges!.subscribe((value) => {
          // do something...
        });
      } else {
        this.subscription.unsubscribe();
      }
    });
  }
}

Мне было интересно, есть ли способ связать подписки, у меня не будет слишком много отступов и вложений в коде. Я думал, что это возможно, используя pipe , но я еще не нашел способ.

Есть ли способ оптимизировать часть подписки?

1 Ответ

0 голосов
/ 31 августа 2018

Вы можете использовать concatMap и внутри него вернуть empty() в случае, если поле невидимо. 

this.isSecondInputVisible
  .pipe(
    concatMap(isVisible => isVisible
      ? this.secondInput.valueChanges!
      : empty()
    )
  )
  .subscribe(valueChanged => /* do something...*/)
...