如何在 Ionic 中打开一个组件
How to open a Component in Ionic
我有一个主页(默认主页)和一个 Components
文件夹,里面有一个名为 login-page 的 Component
内容,其中包含 html、ts , css, 问题是如何从我的 Home
页面打开这个组件?我试着做这样的事情:
import { LoginPageComponent } from '../../components/login-page/login-page';
然后在构造函数中
navCtrl.push(LoginPageComponent );
有什么想法吗?
您不能将普通组件用作页面。将页面用作 Page,将组件用作 Component。使用 ionic g page Login
创建页面 将 html、css、ts 复制到此页面,然后删除该组件。
当您想使用该组件时,您必须将该组件与在另一个组件或页面的 html 中的 @Component 部分中定义的选择器一起包含在内。
当您的组件选择器是 "login-box" 时,您可以在 AnotherPage.ts
中包含这样的组件
<ion-content>
<login-box></login-box>
</ion-content>
可以使用ModalController来推送组件,例如:
export class AnyPage {
constructor(modalCtrl: ModalController) {
let modal = this.modalCtrl.create(LoginPageComponent);
modal.present();
}
}
但实际上,我认为您应该使用页面而不是组件,就像 fastr.de 告诉您的那样。 运行 在您的终端中输入命令 "ionic generate page Login" 然后您就可以使用 NavController 服务了。
我有一个主页(默认主页)和一个 Components
文件夹,里面有一个名为 login-page 的 Component
内容,其中包含 html、ts , css, 问题是如何从我的 Home
页面打开这个组件?我试着做这样的事情:
import { LoginPageComponent } from '../../components/login-page/login-page';
然后在构造函数中
navCtrl.push(LoginPageComponent );
有什么想法吗?
您不能将普通组件用作页面。将页面用作 Page,将组件用作 Component。使用 ionic g page Login
创建页面 将 html、css、ts 复制到此页面,然后删除该组件。
当您想使用该组件时,您必须将该组件与在另一个组件或页面的 html 中的 @Component 部分中定义的选择器一起包含在内。
当您的组件选择器是 "login-box" 时,您可以在 AnotherPage.ts
中包含这样的组件<ion-content>
<login-box></login-box>
</ion-content>
可以使用ModalController来推送组件,例如:
export class AnyPage {
constructor(modalCtrl: ModalController) {
let modal = this.modalCtrl.create(LoginPageComponent);
modal.present();
}
}
但实际上,我认为您应该使用页面而不是组件,就像 fastr.de 告诉您的那样。 运行 在您的终端中输入命令 "ionic generate page Login" 然后您就可以使用 NavController 服务了。