如何在离子中打开组件

Question

我有一个主页（默认的一个），我有一个Components文件夹里面有一个名为login-page的Component内容，其中包含html，ts，css，东西是如何从Home页面打开此组件？我试着做这样的事情：

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告诉你的那样。在终端中运行命令＆＃34;离子生成页面登录＆＃34;然后你可以使用NavController服务。