오늘만살자
페이지 추가 본문
ionic start App sidemenu
cd App
ionic serve -i -c
이 후에 페이지 추가 작업을 한다.
ionic 폴더로 이동한다.
ionic g page other
- src/app/app.modules.ts
import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { MyApp } from './app.component';
import { OtherPage } from '../pages/other/other';
import { HomePage } from '../pages/home/home';
import { ListPage } from '../pages/list/list';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
@NgModule({
declarations: [
MyApp,
OtherPage,
HomePage,
ListPage
],
imports: [
BrowserModule,
IonicModule.forRoot(MyApp),
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
OtherPage,
HomePage,
ListPage
],
providers: [
StatusBar,
SplashScreen,
{provide: ErrorHandler, useClass: IonicErrorHandler}
]
})
export class AppModule {}
- src/app/app.conponents.ts
import { Component, ViewChild } from '@angular/core';
import { Nav, Platform } from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
import {OtherPage} from "../pages/other/other";
import { HomePage } from '../pages/home/home';
import { ListPage } from '../pages/list/list';
@Component({
templateUrl: 'app.html'
})
export class MyApp {
@ViewChild(Nav) nav: Nav;
rootPage: any = HomePage;
pages: Array<{title: string, component: any}>;
constructor(public platform: Platform, public statusBar: StatusBar, public splashScreen: SplashScreen) {
this.initializeApp();
// used for an example of ngFor and navigation
this.pages = [
{ title: 'Other', component: OtherPage },
{ title: 'Home', component: HomePage },
{ title: 'List', component: ListPage }
];
}
initializeApp() {
this.platform.ready().then(() => {
// Okay, so the platform is ready and our plugins are available.
// Here you can do any higher level native things you might need.
this.statusBar.styleDefault();
this.splashScreen.hide();
});
}
openPage(page) {
// Reset the content nav to have just this page
// we wouldn't want the back button to show in this scenario
this.nav.setRoot(page.component);
}
}
- src/pages/other/other.html
<ion-header>
<ion-navbar>
<button ion-button menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>other</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
Addpage
</ion-content>
ionic serve -i -c
'ionic' 카테고리의 다른 글
빌드하기 (0) | 2017.07.20 |
---|---|
리스트에서 화살표가 안보일때 (0) | 2017.07.19 |
알람 - All (0) | 2017.07.19 |
알람 - Basic Alerts (0) | 2017.07.18 |
ionic2 설치 실행 (0) | 2017.07.18 |
Comments