ボタンに基づいて異なるアニメーションを実行する角度をクリック

Question

私は現在、イメージとして5日間のスケジュールを持つIonicのアプリケーションを設計しています。さて、毎日1つずつ、5つのボタンのうちの1つを押すと、フェードインする毎日の「詳細な」ビューを作成したいと思います。

これを行うには、イメージを特定のピクセル数の右側にプッシュし、表示しないはずの4日間で2つの白いイメージにスライドさせるCSSアニメーションを使用します。

私の問題は5つのアニメーションがあり、5つのボタンのどれがクリックされたかに応じて異なるアニメーションを実行したいということです。角度では、私はできません：

document.getElementById('image').setAttribute('animation', 'animation1 2s fade') 

これらのアニメーションを実行するには、ボタン情報をCSSに渡す方法はありますか？

Answer 1

Angular Web Animations APIを使用して、これまでにアニメーションを行うことができます。しかし、IonicはAngularの背後にあるので正しいバージョンを取得する必要があることに注意してください。

npm install @angular/animations@4.1.3 --save --save-exact 

ここには、Ionicが付いているarticle about basics oがあります。