web-dev-qa-db-ja.com

Angularアニメーションが機能しないIEエッジ

Angularのコンポーネントにアニメーションを追加しました。ただし、アニメーションはChromeおよびFirefoxでは正常に機能しますが、IE Edgeでは、スタイルは状態の変化時に正しく適用されますが、アニメーションはトリガーされません。指定されたアニメーション。

誰かが同じ問題を抱えていますか？

これが私のコードです：

animations: [
    trigger('rowState', [
        state('collapsed', style({
            'height': 0,
            'overflow-y': 'hidden'
        })),
        state('expanded', style({
            'height': '*',
            'overflow-y': 'hidden'
        })),
        transition('collapsed <=> expanded', [animate('1000ms ease-out')])
    ])
]

前もって感謝します

angularmicrosoft-edgeangular-animations
11
Haris

Webアニメーションは Edge ではサポートされていません。 polyfill を追加する必要があります

Angularアニメーションは、標準のWeb Animations APIの上に構築され、それをサポートするブラウザーでネイティブに実行されます。他のブラウザの場合、ポリフィルが必要です。 GitHubから web-animations.min.js を取得し、ページに追加します。

7
PierreDuc

polyfills.tsにpolyfillを追加する必要があります

コメントを削除する

import web-animations-js;

次に実行します

npm install --save web-animations-js
3
Dulanga Heshan