我正在将参数从一个组件传输到app.component.ts,但出现了错误。错误:没有NavParams的提供程序。
这是我的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" },
];
}
initializeApp() {
this.platform.ready().then(() => {
this.statusBar.styleDefault();
this.splashScreen.hide();
});
}
openPage(page) {
this.nav.setRoot(page.component);
}
loginpage2() {
this.nav.push(LoginpagePage);
}
logoutClicked() {
console.log("Logout");
this.nav.pop();
}
}
在这个组件中,我获取navparam值如下:uname = this.navParams.get('param 1');
这是我的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);
}
}
错误:没有NavParams的提供程序。任何帮助都非常感谢。
8条答案
按热度按时间kxeu7u2r1#
你能试着加一下吗。希望能成功。如果你给我一个项目,我可以更好地帮助你。
mcdcgff02#
我找到了一个解决方案,而不是在
constructor
中添加navParams
添加
public navParams = new NavParams
例如
um6iljoc3#
我遇到了同样的问题,我必须做两件事来解决它:
通过这两个更改,我可以在de Modal ts文件中使用navParams:
ny6fqffe4#
我用这个变体
在Forward-Page
工程伟大
ehxuflar5#
使用
ActivatedRoute
接口从'@angular/router'
简单地检索查询参数:hiz5n14c6#
你是否在@NgModule中导入了离子Angular 模块?
68bkxrlz7#
对我来说(ionic7)是使用Angular的方式:
htrmnn0y8#
我得出的结论是,app.component.ts是在应用程序中呈现的第一个东西。你不能导航到它,显然,你不能接收参数。
**第一种解决方案是:**我必须使用提供程序来存储您的用户数据,然后从提供程序设置您的侧菜单数据。
**第二个解决方案是:**使用下面的事件。
通过使用事件,我已经解决了我的问题,我的事件代码工作正常。