一、项目搭建
1.安装nodeJS;
2.安装ionic和cordova命令:
npm install -g ionic cordova
3.创建项目:项目类型有tabs、sidemenu、blank、super、tutorial
ionic start [name] blank
4.查看并启动项目:
cd [name]
ionic serve
二、创建page页
使用命令:
ionic g page [PageName]
生成的[PageName].module.ts可以删掉。如果页面的生成定义放在app.module.ts,[PageName].module.ts里不能重复定义。
三、点击页面跳转
1.html页面添加点击事件,比如:
<button ion-button (click)="goToListsPage()">go to lists</button>
2.ts页先导入navController和要跳转的class,再加入点击的方法,比如:
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
//导入要跳转页面的class
import { ListsPage } from '../lists/lists';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
constructor(public navCtrl: NavController) {
}
//编写点击跳转的方法
goToListsPage() {
this.navCtrl.push(ListsPage);
}
}