Angular 2：爲什麼在檢索路由參數時使用switchMap？

Question

我正在閱讀Angular Guide about Routing & Navigation。

他們使用此代碼檢索路由器的PARAM 'id'並用它來得到一個英雄與service服務：

ngOnInit() { 
    this.route.params 
    .switchMap((params: Params) => this.service.getHero(+params['id'])) 
    .subscribe((hero: Hero) => this.hero = hero); 
} 

但我不能很好地理解什麼是在使用switchMap運營商的目的以上代碼。

以下代碼將不會相同？

ngOnInit() { 
    this.route.params 
    // NOTE: I do not use switchMap here, but subscribe directly 
    .subscribe((params: Params) => { 
     this.service.getHero(+params['id']).then(hero => this.hero = hero) 
    }); 
} 

Answer 1

switchMap通常是用來當你有一個由一些預謀「事件/流」引發一些異步操作。

與例如flatMap或concatMap是，只要下一個觸發器發出，當前的異步操作就會被取消並重新觸發。

在你的情況下，這意味着只要route-params改變，你的英雄服務會自動再次被改變的參數調用，並且前面的呼叫被取消，所以你不會收到過時的數據。

這對搜索查詢特別有用，搜索查詢可能需要更長的時間，然後在200-300ms之間，並在用戶輸入時觸發。

以下代碼將不會相同？

號雖然它可能表現在很多情況下是相同的，如果你想象以下場景：

1. PARAM更改爲 「4」
2. getHero(4)（一個非常緩慢的要求）
3. PARAM變化爲 「1」
4. getHero(1)（快速請求）
5. getHero(1)完成 - >英雄是 「1」
個
6. getHero(4)完成 - >英雄，現在是「4」，但最近使用PARAM是「1」

在這種情況下switchMap只會丟棄getHero(4) -call，因爲它一旦過時作爲新的觸發發生。