Ищем оператор RxJs, который возвращает раньше, пропуская приведенные ниже операторы, а не filter () или skip ()

  • У меня есть автозаполнение ввода.
  • Каждый раз, когда вводится или удаляется письмо, я выполняю HTTP-запрос.
  • Ответ сопоставляется со списком предложений, который я показываю в раскрывающемся списке под полем ввода.

Однако: если последняя буква удалена, что делает ввод пустым, я хочу пропустить HTTP-запрос и т. Д. И вместо этого вернуть пустой массив.

Поэтому мне нужен оператор, вызываемый первым в конвейере, который каждый раз, когда выполняется условие, пропускает все указанные ниже операторы и «возвращает раньше», как операторы «break» или «return» в цикле for.

Я не могу использовать filter (), потому что этот оператор предотвратит генерацию наблюдаемого объекта. Но мне нужно, чтобы он испустил, чтобы очистить раскрывающийся список.

<input [formControl]="formGroup.searchTerm">
<ul>
 <li *ngFor="let suggestion of suggestions$ | async">{{suggestion}}</li>
</ul>

suggetions$ = this.formGroup.valueChanges.pipe(
    pluck('searchString')
    // filter(searchString => searchString.length > 0) // does not help
    unknownOperator(searchString => {
        if(searchString.length === 0) {
            skipOperatorsBelowAndReturnThisInstead([])
        } else {
            continueWithOperatorsBelow(searchTerm)
        }
    })
    switchMap(values => this.http.get(this.url + values.term)),
    map(this.buildSuggestions),
),

Спасибо!


javascript rxjs rxjs-pipeable-operators
person Martin Jaskulla    schedule 14.09.2019    source источник
comment
Просто используйте дебаунс   -  person Adrian Brand    schedule 14.09.2019

Ответы (1)


arrow_upward
4
arrow_downward

Вы не можете пропустить все приведенные ниже операторы с помощью оператора. Вы должны переключиться на другой поток в зависимости от условия.

suggetions$ = this.formGroup.valueChanges.pipe(
  pluck('searchString'),
  switchMap(searchString => searchString.length === 0
    ? of([])
    : this.http.get(this.url + searchString).pipe(
      map(this.buildSuggestions)
    )
  )
);
person frido    schedule 14.09.2019
comment
Вы также можете взглянуть на оператор iif: rxjs-dev. firebaseapp.com/api/index/function/iif - person Nils Mehlhorn; 14.09.2019
comment
@Nils хороший комментарий, спасибо - person danday74; 09.07.2021