更改方法沒有得到服務錯誤後調用Angular 2

Question

我有一個簡單的搜索方法與RXJS反跳

像這樣。

this.searchTerm.valueChanges 
     .debounceTime(this._debounceDelay, this._scheduler) 
     .distinctUntilChanged() 
     .filter(this.filterForBlank.bind(this)) 
     .filter(this.filterForLength.bind(this)) 
     .switchMap(term => this.searchService.serchBy(term)) 
     .subscribe((data) => { 
     // do something 
     }, (err) => { 
      // show error on UI 
     }); 




private filterForLength(term: string) { 
    return (term.trim().length > 2); 
    } 

    private filterForBlank(term: string) { 
    if (isEmpty(term)) { 
       return false; 
    } 
    return true; 
    } 

但是，如果有錯誤，例如，我將網址更改爲錯誤的...此更改功能不再打。即使更改後的值

我認爲如果出現錯誤，我需要殺死observable。但是完全不知道如何實現這一點。

Answer 1

你的解釋幾乎是正確的。如果你讓可觀察到的錯誤沒有捕捉到錯誤，它可能不再工作。你需要做的是使用catch操作符來捕獲錯誤並處理失敗而不殺死observable。

這可能是這樣的：

this.searchTerm.valueChanges 
    .debounceTime(this._debounceDelay, this._scheduler) 
    .distinctUntilChanged() 
    .filter(this.filterForBlank.bind(this)) 
    .filter(this.filterForLength.bind(this)) 
    .switchMap(term => this.searchService.serchBy(term)) 
    .catch(errors => { 
    return Rx.Observable.empty(); 
    }); 
    .subscribe((data) => { 
    // do something 
    }); 

現在，如果你是後端調用失敗，它會通過正常的catch子句處理，並會返回一個新的空值。您可以使用這個空值來清除您成功顯示的任何數據。如果有效，它會跳過catch子句。編輯： 你是對的。這不起作用。由於這樣的事實，如果一個可觀察的鏈錯誤，整個鏈條都被打破了。爲了解決這個問題，你需要做的是：

this.searchTerm.valueChanges 
    .debounceTime(this._debounceDelay, this._scheduler) 
    .distinctUntilChanged() 
    .filter(this.filterForBlank.bind(this)) 
    .filter(this.filterForLength.bind(this)) 
    .switchMap(term => 
       this.searchService.serchBy(term) 
        .catch(errors => { 
          // show error on ui 
          return Rx.Observable.empty() 
        })) 
    .subscribe((data) => { 
    // do something 
    }); 

通過移動switchMap裏面的catch語句，這將是switchMap將打破內觀察到的鏈。然而，從'this.searchTerm.valueChanges'開始的原始鏈不會被打破並保持活力。

我對錯誤的答案表示歉意。