离子2动画没有iOS设备
问题描述:
上工作,我已经使用离子2 sidemenu离子2动画没有iOS设备
$ ionic start mySideMenu sidemenu --v2
我只记下了几个代码只是为了测试,如果这个工程在iOS设备/仿真器创建的项目。
page1.ts
import { Component, trigger, state, style, transition, animate } from '@angular/core';
import { NavController } from 'ionic-angular';
@Component({
selector: 'page-page1',
templateUrl: 'page1.html',
animations: [
trigger('buttonState', [
state('left', style({ transform: 'translateX(100px)', backgroundColor: 'red' })),
state('right', style({ transform: 'translateX(0)', backgroundColor: 'blue' })),
transition('left <=> right', [
animate('1000ms ease-in-out')
])
])
]
})
export class Page1 {
state: string = 'left';
constructor(public navCtrl: NavController) {
}
changeState() {
this.state = this.state == 'left' ? 'right': 'left';
}
}
page1.html
<ion-header>
<ion-navbar>
<button ion-button menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>Page One</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
<h3>Ionic Menu Starter</h3>
<p>
If you get lost, the <a href="http://ionicframework.com/docs/v2">docs</a> will show you the way.
</p>
<button ion-button secondary [@buttonState]="state" (click)="changeState()">Toggle Menu</button>
</ion-content>
现在,构建应用程序,并在模拟器/设备的测试之后,唯一在这里工作是颜色的变化和位置。甚至没有一个像素被移动。
它适用于Android设备,不适用于iOS。我只想使用Angular的内置动画。关于这个我怎么能使它在两个平台上工作的任何想法?谢谢