Angular 2: why use switchMap when retrieving route params?

switchMap is usually used when you have some async operation that is triggered by some prepended “event/stream”.

The difference to e.g. flatMap or concatMap is, that as soon as the next trigger emits, the current async operation is canceled and re-triggered.

In your case this means, that as soon as the route-params change, your hero-service is automatically called again with the changed params and the previous call is canceled so you won’t receive outdated data.

This is especially helpful for search-queries that might take longer then 200-300ms and are triggered while a user is typing.

The following code would not be the same?

No. While it might behave the same in many cases, if you imagine the following scenario:

  1. param changes to “4”
  2. getHero(4) (a very slow request)
  3. param changes to “1”
  4. getHero(1) (a fast request)
  5. getHero(1) completes -> hero is “1”
  6. getHero(4) completes -> hero is now “4” but the last used param was “1”

In such a case switchMap would just discard the getHero(4)-call since it is outdated as soon as a new trigger happens.

Leave a Comment

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)