2017-03-15 4 views
0

私は今、Angular2を学んでいます。 AngularJSでは、私はグリッドレイアウトでブートストラップするために使用されました。今、私はフレックスレイアウトでフィットするレイアウトを得ようとしています。Angular2フレックスレイアウト - レンダリング

しかし、ここで私の問題が始まります。

セットアップ:

私は500アイテムのコレクションを持っています。 タブレットとデスクトップデバイスでは表形式で、スマートフォンでは列形式で表示したいと考えています。 そのため私はfxLayout="row"fxLayout.xs="column"を使用しています。

しかし、グリッドのインサイトローディングには、ウィンドウのサイズをモバイルディスプレイに合わせると時間がかかります。 スクリーンサイズが大きいほど(sm以上)約2-3秒かかります。モバイルのスクリーンサイズでは約7秒かかります。

これらのパフォーマンスの問題を解決する方法を知ってもらえれば幸いです。

私は問題を見ることができるplunkrを作成しました。画面サイズが変更されてdivが列に表示され、コード内の何かを変更して強制的にリロードすると、画面のサイズを大きくする(divが行で表示される)場合よりもページのリロードに時間がかかります。

Plunkr

答えて

0

フレックスレイアウトは、大規模なデータセットをレンダリングするためにそれを使用するときにパフォーマンスの問題を持っています。 https://github.com/angular/flex-layout/wiki/Performance-Considerations

あなたは

はこちらのページをご覧ください/リストこのテーブルのマニュアルのアプローチを検討すべきです

関連する問題