Chaining HttpClient calls in Angular 6

I think I have read 100+ posts on the topic, and I still cannot figure out how to chain two HttpClient calls using rxjs in Angular 6.

Let's say I have a service with that signature:

GeoService {
  getState(): Observable<string> {
    return this.http.get<string>(stateURL);
  }
  getCities(state: string): Observable<string[]> {
    return this.http.get<string[]>(citiesURL + state);
  }
}

I can't for the life of me figure out how to obtain both the state and the corresponding list of cities in my component:

import { Observable } from 'rxjs';
import { map, flatMap, mergeMap, filter, switchMap } from 'rxjs/operators';

...

ngOnInit() {
  this.svc.getState().
  pipe(map((state) => {
      this.state = state;
      return this.svc.getCities(state);
    }),
    mergeMap((cities) => this.cities = cities))
).subscribe(console.log('done'));

The code above in one of my 20 random attempts at combining pipe/map/mergeMap/subscribe in every way I could think of... a working example would be really really appreciated :)

Thanks!

Edit: None of the "possible duplicate" posts contain an actual example that works

You can do something like this

this.svc.getState().pipe(
     tap(state=>this.state=state),
     switchMap(this.svc.getCities))
.subscribe(cities=>{
    //got the cities
})

the map operator is here to transform the emited value, but the tap operator is used to do something without modifying emited value of the observable.

note that switchMap(this.svc.getCities) is equivalent to switchMap(state=>this.svc.getCities(state)