具有RxJs switchMap订阅的Angular typeahead

时间:2018-05-11 13:57:15

标签: angular rxjs ng-bootstrap bootstrap-typeahead

使用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 => {               
        });

1 个答案:

答案 0 :(得分: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);