angular2 ionic2如何从组件执行动画并绑定数据

我有一个包含图像的组件，我不想像tinder一样给它添加滑动动画

如何将deltaX（从事件）提供给动画。 在jquery中，它将类似于：

$card.css("transform", "translateX("+ pullDeltaX +"px) rotate("+ deg +"deg)");

安格拉尔2号怎么样

我的代码：

<ion-card 
        (swipe)="gradeProfile($event)"
        (pan)="panEvent($event)"
        @StateItem="state" 
        class="active-card card"
        >
        <img [src]="selectedProduct?.image_path" />

    </ion-card>
    <ion-card class="inactive-card card" >
        <img *ngIf="products.length" [src]="products[products.length - 1]?.image_path" />
    </ion-card>

---

//要执行调用transform（event.deltaX）动画

我修复了元素activeCartSetTranslation（target，deltaX，rotation，translationUnits='px'）{target.style.transform=

translate3d（${deltaX}${translationUnits}，0px，0px）rotate（${rotation}deg）

；}更改动画状态后，元素样式设置为来自triggerI的样式修复此问题在元素activeCartSetTranslation（目标、deltaX、旋转、平移单位='px'）{target.style.transform=

translate3d（${deltaX}${translationUnits}，0px，0px）旋转（${rotation}deg）

；}在更改动画状态后，元素样式将设置为“来自触发器的样式”

@Component({
templateUrl: 'build/pages/picker/picker.html',
animations: [
    trigger('StateItem', [
        state('initState', style({
            transform: 'translate(0)',
            opacity: 1
        })),
        state('moveState', style({
        })),
        state('moveLike', style({
            transform: 'translate(10vw) rotate(10deg)',
        })),
...
panEvent(event) {