0

angular7 フロントエンド内でスクロールのアニメーションを動作させようとしていますが、ルーター アウトレット内では動作しません。これは、スクロールに関する多くの関連する質問で示唆されているように、角度がルーターアウトレット内のスクロール位置を処理する方法に関係していると思います。

私の質問: ルーター アウトレット内で意図した動作を実現するにはどうすればよいですか? これは可能ですか？問題が発生する理由について誰かが説明していますか?

具体的には、スクロールによって到達したら、いくつかの div で animations.css から zoomIn アニメーションを適用したいと思います。これを機能させるために、divがルーターアウトレット内に配置されるまで、うまく機能するパッケージ「ng2-animate-on-scroll」を使用しています。

私のapp.component.htmlで：

<div animateOnScroll animationName="animated zoomIn">
     text to zoom in on scroll <---works
</div>

<router-outlet></router-outlet> <--- everything in here doesn't work

<div animateOnScroll animationName="animated zoomIn">
     text to zoom in on scroll <---doesn't work
</div>

ルーター アウトレットの上の app.component.html 内にいくつかの div を配置すると、スクロールのアニメーションが表示され、期待どおりに動作します。ただし、router-outlet 以下のすべてはアニメーション化されません。

助言がありますか？

4

1 に答える 1