No provider for NavParams error is coming In Ionic App

Ionic Framework
1

I am transferring parameters from one component to app.component.ts but the error is coming. Error: No provider for NavParams.

This is my app.component.ts :slight_smile:

I am transferring parameters from one component to app.component.ts but the error is coming. Error: No provider for NavParams.

This is my app.component.ts :

import { FrontPage } from './../pages/front/front';
import { Component, ViewChild } from '@angular/core';
import { Nav, Platform, NavController, NavParams} from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
import { HomePage } from '../pages/home/home';
import { ListPage } from '../pages/list/list';
import { ProductPage } from '../pages/product/product';
import { LoginpagePage } from '../pages/loginpage/loginpage';

@Component({
  templateUrl: 'app.html'
})
export class MyApp {
  @ViewChild(Nav) nav: Nav;
  menuclick: boolean = true;
  menuclick2: boolean = false;
  rootPage: any = FrontPage;
  uname: string;

  pages: Array<{title: string, component: any, name2: string}>;

  constructor(public platform: Platform, public statusBar: StatusBar, public splashScreen: SplashScreen, public navParams: NavParams) {
    this.initializeApp();
    this.uname = this.navParams.get('param1');
    this.pages = [
      { title: 'Home', component: FrontPage, name2: 'home' },
      { title: 'Product Categories', component: ProductPage, name2: 'basket' },
      { title: 'Merchandise', component: ProductPage, name2: 'man' },
      { title: 'My Orders', component: ProductPage, name2: 'cart' },
    ];

  }
'''

In this component, I am getting the navparam value like this this.uname = this.navParams.get('param1');

This is my loginpage.ts:

‘’’
import { Component } from ‘@angular/core’;
import { IonicPage, NavController, NavParams, AlertController } from ‘ionic-angular’;
import { RestapiProvider } from ‘…/…/providers/restapi/restapi’;
import { ListPage } from ‘…/list/list’;
import { FrontPage } from ‘…/front/front’;
import { CartPage } from ‘./…/cart/cart’;
import {Validators, FormBuilder, FormGroup } from ‘@angular/forms’;
import { MyApp } from ‘./…/…/app/app.component’;

@IonicPage()
@Component({
selector: ‘page-loginpage’,
templateUrl: ‘loginpage.html’,
})
export class LoginpagePage {
todo : FormGroup;
responseData : any;
userData = {“username”: “”, “password”: “”};
constructor(public navCtrl: NavController, public navParams: NavParams,
public restProvider: RestapiProvider, private formBuilder: FormBuilder, private alertCtrl: AlertController) {
this.todo = this.formBuilder.group({
username: [’’, Validators.required],
password: [’’, Validators.required],
});
}

ionViewDidLoad() {
console.log(‘ionViewDidLoad LoginpagePage’);
}

getloginUsers(){
  this.restProvider.getUsers(this.userData, 'user_Login').subscribe((data) => {
    console.log(data);
    if (data) {
      this.responseData = data;
      console.log(this.responseData.msg.name);
      if (this.responseData.status === 'success') {
        this.navCtrl.push(MyApp,{
          param1: this.responseData.msg.name,
        });
      }
      else{
        this.presentAlert();
      }
    }
  });

}

presentAlert() {
let alert = this.alertCtrl.create({
title: ‘Incorrect Username Or Password’,
buttons: [‘Dismiss’]
});
alert.present();
}

cardpage2()
{
this.navCtrl.push(CartPage);
}
}



Error: No provider for NavParams is coming. Any help is much appreciated