Firestore: Passing angularfire2 async data as Ionic 3 navParams not working

cities: Observable<any>;


this.cities = this.fsProvider.collection('cities').map(cities => {
    return cities.map(city => {
      city.country = this.fsProvider.doc(`countries/${city.country_id}`);
      return city;
    });
});

city includes country info as Observable data. So if I pass city to another page as a navParam, just this.navCtrl.push(AnotherPage, {city: city}), I can't get country info on the AnotherPage.

I just added the demo here: https://stackblitz.com/edit/ionic-firestore.

Any thoughts are welcome.