页面跳转——ionic

最新推荐文章于 2025-05-31 17:02:33 发布

原创最新推荐文章于 2025-05-31 17:02:33 发布 · 1.2k 阅读

0 ·

CC 4.0 BY-SA版权

ionic 专栏收录该内容

16 篇文章

订阅专栏

本文介绍如何在Ionic应用中实现页面跳转及使用ModalController来显示模态视图。通过具体的代码示例，展示了如何引入NavController和ModalController，并创建了一个展示登录页面模态框的功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

页面跳转基本需求

引入ModalController！！！

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams, ModalController } from 'ionic-angular';
import { LoginPage } from '../login/login'

/**
 * Generated class for the MorePage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */

@IonicPage()
@Component({
  selector: 'page-more',
  templateUrl: 'more.html',
})
export class MorePage {

  constructor(public navCtrl: NavController, 
              public navParams: NavParams,
              public modalCtrl: ModalController) {
  }

  showModal(){
    let modal = this.modalCtrl.create(LoginPage);
    modal.present();
  }

}