1 2 3 4 | > npm install -g ionic cordova > ionic start test tabs > cd test > ionic serve |
1 2 3 4 5 6 7 8 9 10 11 | import { Component } from '@angular/core'; import {MenuController, NavController} from 'ionic-angular'; @Component({ selector: 'page-home', templateUrl: 'home.html' }) export class HomePage { constructor(public navCtrl: NavController, menu: MenuController) { menu.enable(true); } } |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 | <ion-header> <ion-navbar> <button ion-button menuToggle icon-only> <ion-icon name='menu'></ion-icon> </button> <ion-title> Menus </ion-title> </ion-navbar> </ion-header> <ion-content padding> <button ion-button block menuToggle>Toggle Menu</button> </ion-content> <ion-menu [content]="content"> <ion-header> <ion-toolbar> <ion-title>Menu</ion-title> </ion-toolbar> </ion-header> <ion-content> <ion-list> <button ion-item (click)="openPage(homePage)"> Home </button> <button ion-item (click)="openPage(friendsPage)"> Friends </button> <button ion-item (click)="openPage(eventsPage)"> Events </button> <button ion-item (click)="closeMenu()"> Close Menu </button> </ion-list> </ion-content> </ion-menu> <ion-nav id="nav" #content></ion-nav> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 | <ion-header> <ion-navbar> <ion-title> About </ion-title> </ion-navbar> </ion-header> <ion-content padding> <ion-grid> <ion-row> <ion-col col-6> <ion-list> <ion-list-header> Section I </ion-list-header> <ion-item>Terminator I</ion-item> <ion-item>Blade Runner</ion-item> <ion-item> <button ion-button color="danger" outline>Choose</button> </ion-item> </ion-list> </ion-col> <ion-col col-6> <ion-list> <ion-list-header> Section II </ion-list-header> <ion-item>Terminator II</ion-item> <ion-item>Blade Runner</ion-item> <ion-item> <button ion-button color="secondary" outline>Choose</button> </ion-item> </ion-list> </ion-col> </ion-row> </ion-grid> </ion-content> |
欢迎光临 电子技术论坛_中国专业的电子工程师学习交流社区-中电网技术论坛 (http://bbs.eccn.com/) | Powered by Discuz! 7.0.0 |