我可以从离子组件导航到离子页面吗？答案

【问题标题】：Can I navigate to an ionic page from an ionic component?我可以从离子组件导航到离子页面吗？
【发布时间】：2018-05-17 21:31:18
【问题描述】：

我正在使用 Ionic Framework 开发应用程序。有可能它增长很快，我想学习调制和正确重用页面、组件等。

因此，出现了这个问题，我无法通过自己的方式解决：是否可以从组件调用模态或页面（使用 NavController）？

假设我们有一个页面。在其中，我想使用几个可重用的组件。

任何页面：

<ion-content>
   <my-component-1> </ my-component-1>
   <my-component-2> </ my-component-2>
</ ion-content>

例如，my-component-1 应该是一个将我们发送到另一个页面或模式的按钮。

如果我想使用延迟加载并避免“无组件为 MyPage 找到工厂？
我应该在哪个模块中声明我的页面？

【问题讨论】：

标签： cordova ionic-framework mobile web-applications ionic3

【解决方案1】：

这是一个基本的实现：

.ts

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
// import your pages

@Component({...})
export class SomePage {

  constructor(public navCtrl: NavController) {}

  openComponentOne(){
    this.navCtrl.push(FirstPage)
    // OR
    // this.navCtrl.setRoot(OnePage)
  }

  openComponentTwo(){
    this.navCtrl.push(SecondPage)
    // OR
    // this.navCtrl.setRoot(SecondPage)
  }
}

.html

<ion-content padding>
  <button ion-button (click)="openComponentOne()">
    Component One
  </button>
  <button ion-button (click)="openComponentTwo()">
    Component Two
  </button>
</ion-content>

【讨论】：