如何只執行一個Observable如果term不爲null/empty？

Question

我有我的構造函數中以下代碼：

this.searchResults = this.searchTerm.valueChanges 
    .debounceTime(500) 
    .distinctUntilChanged() 
    .switchMap(term => this.apiService.search({ 
     limit: this.searchResultsLimit, 
     term: term 
    })); 

這是我輸入

<input type="text" [formControl]="searchTerm" /> 

你可以看到我跟着獲取代碼here教程。

我的API服務方法如下：

searchCompanies(options): Observable<any[]> { 
    return this.jsonp.get('api/search', this.formatOptions(options)).map(res => { 
     return res.json(); 
    }); 
} 

每次searchTerm是我裏面輸入改變，API調用被激發。我的問題是，即使當我的輸入爲空時（例如輸入查詢，然後退回全部），調用也會被觸發。

我的問題是，當`searchTerm的值不爲空/空值時，我怎麼才能讓我的observable被觸發？

Answer 1

如果你想避免API調用，並希望搜索結果被重置時，搜索詞爲空測試在switchMap和一個空字符串返回一個空觀察到在這種情況下：

this.searchResults = this.searchTerm 
    .valueChanges 
    .debounceTime(500) 
    .distinctUntilChanged() 
    .switchMap(term => term ? 
    this.apiService.search({ 
     limit: this.searchResultsLimit, 
     term: term 
    }) : 
    // If search term is empty, return an empty array 
    // or whatever the API's response for no matches 
    // would be: 
    Observable.of([]) 
    }); 

Answer 2

最容易被剛剛使用filter()運營商過濾掉所有空term S：

this.searchResults = this.searchTerm.valueChanges 
    .filter(term => term) // or even better with `filter(Boolean)` 
    .debounceTime(500) 
    .distinctUntilChanged() 
    .switchMap(term => this.apiService.search({ 
     limit: this.searchResultsLimit, 
     term: term 
    }));