移除了@App和@Page,使用@Component
ionicBootstrap是必须的
重命名了应用程序的生命周期
所有事件也被重命名
============================================
变化如下:
Ionic生命周期事件重命名:
-
onPageLoaded重命名为ionViewLoaded -
onPageWillEnter重命名为ionViewWillEnter -
onPageDidEnter重命名为ionViewDidEnter -
onPageWillLeave重命名为ionViewWillLeave -
onPageDidLeave重命名为ionViewDidLeave -
onPageWillUnload重命名为ionViewWillUnload -
onPageDidUnload重命名为ionViewDidUnload
Ionic组件事件重命名:
- Checkbox
-
change->ionChange
-
- DateTime
-
change->ionChange -
cancel->ionCancel
-
- InfiniteScroll
-
infinite->ionInfinite
-
- Menu
-
opening->ionDrag -
opened->ionOpen -
closed->ionClose
-
- Option
-
select->ionSelect
-
- Picker
-
change->ionChange
-
- RadioButton
-
select->ionSelect
-
- RadioGroup
-
change->ionChange
-
- Refresher
-
refresh->ionRefresh -
pulling->ionPull -
start->ionStart
-
- Searchbar
-
input->ionInput -
blur->ionBlur -
focus->ionFocus -
cancel->ionCancel -
clear->ionClear
-
- Segment
-
change->ionChange -
select->ionSelect
-
- Select
-
change->ionChange -
cancel->ionCancel
-
- Slides
-
willChange->ionWillChange -
didChange->ionDidChange -
move->ionDrag
-
- TabButton
-
select->ionSelect
-
- Tab
-
select->ionSelect
-
- Tabs
-
change->ionChange
-
- Toggle
-
change->ionChange
-
一、把@Page替换成@Component
//老的写法
import {Page} from'ionic-angular';
@Page({
})
//新的写法
import {Component} from '@angular/core'; @Component({ })
二、@App更换为@Component,并且在与你的配置末尾添加ionicBootstrap功能。
//老的写法
import {App, Platform} from 'ionic-angular'; @App({ templateUrl: 'build/app.html', providers: [ConferenceData, UserData], config: { tabbarPlacement: 'bottom' } export class MyApp { }
//新的写法
import {Component} from '@angular/core'; import {ionicBootstrap, Platform} from 'ionic-angular'; @Component({ templateUrl: 'build/app.html', }) export class MyApp { } ionicBootstrap(MyApp, [ConferenceData, UserData], { tabbarPlacement: 'bottom' });
三、重全名IonicApp为App:
//老的写法
import {IonicApp} from 'ionic-angular'; constructor( private app: IonicApp ) {
//新的写法
import {App} from 'ionic-angular'; constructor( private app: IonicApp ) {
四、重命名了所有应用程序生命周期
//老的写法
onPageDidEnter() { console.log("Entered page!"); }
//新的写法
ionViewDidEnter() { console.log("Entered page!"); }
五、重命名Ionic事件
//老的写法
<ion-slides (slideChangeStart)="onSlideChangeStart($event)">
//新的写法
<ion-slides (ionWillChange)="onSlideChangeStart($event)">