5

次の Angular 2 アニメーションを作成しました。

trigger('detailsContentAnimation',
  [
    state('1', style(
      {
        'height': '*',
        'padding-top': '*',
        'padding-bottom': '*'
      })),
    state('0', style(
      {
        'height': 0,
        'padding-top': 0,
        'padding-bottom': 0
      })),
    transition('* => *', animate('400ms ease-out'))
  ])

このアニメーションは、次の HTML コンテンツにスライド イン/アウトする必要があります。

<div>
 <div class="col-card__content-div">
  <div [@detailsContentAnimation]="areDetailsVisible" class="card-block">
    <ng-content select=".col-card__contentselector--body"></ng-content>
  </div>
</div>

アニメーションの実行中に、次のエラーが発生します。

'Element' で 'animate' を実行できませんでした: 部分的なキーフレームはサポートされていません。"

なぜこれが起こっているのですか、どうすれば修正できますか?

4

1 に答える 1