この記事とそれに似たいくつかの記事に従って、ルート間の遷移を追加しようとしています。
実際に動作させることはできますが、CSS position-absolute の使用に問題があり、これが必要と思われます:
router-outlet ~ * {
position: absolute;
width: 100%;
height: 100%;
}
私のアプリには、ヘッダー、メイン、フッターの複数のルート アウトレットがあります。アプリのルートでフレックスボックスを使用して、ヘッダーとフッターを上下に固定しています。
このstackblitzでレイアウトとトランジションが機能していることを確認できます。
問題は、位置を絶対および 100% に設定すると、コンテンツがフッターにはみ出すことです (「概要」ページを参照)。
position: absolute なしでクロスフェード遷移を行う方法はありませんか? これは、コンテンツがページ全体を占めると想定しているようです。ご覧のとおり、多くの場合、フッターやその他の静的コンテンツ、または 2 番目のルーター アウトレットなどの他のコンテンツがあります。
私が探しているのは、特定のルーター アウトレットにあるものだけに影響を与える遷移です。