Angular 使用 RxJs switchMap 订阅提前输入

Question

使用Angular bootstrap Typeahead 插件显示颜色。但是我需要像在我使用的其他地方一样解决循环引用。我不能用 RxJs SwitchMap 运算符来实现。还有其他可能的解决方法吗？

(<any>window).resolveJsonReferences(this.colorService.searchColors(term))

使用 RxJs SwitchMap 提前输入

 search = (text$: Observable<string>) =>
    text$
    .debounceTime(200)
    .distinctUntilChanged()
    .do(() => this.searching = true)
    .switchMap(term =>
        this.colorService.searchColors(term) // Json result needs circular reference resolver
        .do(() => this.searchFailed = false)
        .catch(() => {
            this.searchFailed = true;
            return Observable.of([]);
        }))
    .do(() => this.searching = false);

其他地方

return this.colorService.searchColors(term)
        .subscribe(
        res => {               
            this.colors= this.utilities.resolveJsonReferences(res);
        },
        err => {               
        });

Answer 1

只需 map 通过您的解析器的值。

.map((term) => this.utilities.resolveJsonReferences(term))

总计：

search = (text$: Observable<string>) =>
    text$
    .debounceTime(200)
    .distinctUntilChanged()
    .do(() => this.searching = true)
    .switchMap(term =>
        this.colorService.searchColors(term) // Json result needs circular reference resolver
        .map((term) => this.utilities.resolveJsonReferences(term))
        .do(() => this.searchFailed = false)
        .catch(() => {
            this.searchFailed = true;
            return Observable.of([]);
        }))
    .do(() => this.searching = false);