如何在Ionic中打开组件

Question

我有一个主页(默认的主页)，我有一个Components文件夹，里面有一个名为Component的东西，它包含html、ts、css，问题是如何从Component页面打开这个组件？我试过这样做：

import { LoginPageComponent } from '../../components/login-page/login-page';

然后在构造函数中

navCtrl.push(LoginPageComponent );

有什么想法吗？

Answer 1

不能使用普通组件作为页面。使用页面作为页面，使用组件作为组件。使用ionic g page Login复制html、css、ts创建一个页面，然后删除该组件。

当您想要使用该组件时，必须将该组件包含在另一个组件或页面的html中的@Component节中定义的选择器中。

当组件选择器是“登录框”时，可以在AnotherPage.ts中包含如下组件

<ion-content>
   <login-box></login-box>
</ion-content>

Answer 2

您可以使用ModalController来推送组件，例如：

export class AnyPage {

  constructor(modalCtrl: ModalController) {
     let modal = this.modalCtrl.create(LoginPageComponent);
     modal.present();
  }
}

但实际上，我认为您应该使用Page而不是组件，就像fastr.de告诉您的那样。在您的终端中运行命令“离子型生成页面登录”，然后您可以使用NavController服务。