Property 'push' does not exist on type 'NavController' in Angular

Question

I'm building Ionic app and I need to navigate to another page when I click on the button and pass the variable, but for some reason this.navCtrl.push() is not working.

What might be the issues? Thank you in advance.

HomePage:

import { Component, Input, Output, EventEmitter } from '@angular/core';
import { CurrentWeatherPagePage } from '../current-weather-page/current-weather-page.page';
import { NavController, NavParams } from '@ionic/angular';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {

  constructor(public navCtrl:NavController){}

  cityName = ''
  logForm() {
    console.log(this.cityName);
    this.navCtrl.push(CurrentWeatherPagePage, this.cityName);
  }

  

}

Answer 1

You have to use navCtrl.navigateForward and if you need to pass parameters you can do this

this.navCtrl.navigateForward(<URL>, { state: { <DATA> } } );

Then in the other view, in the constructor, do this

data: any = null ;

constructor(private router: Router) { 
    this.data = this.router.getCurrentNavigation()?.extras?.state;
}