md-virtual-repeatとmd-virtual-repeat-containerを使用した折りたたみ可能なグループヘッダー

Question

私は表示縮退グループをmd-virtual-repeatを使った概念の証明として実装しようとしています。内部内容はバーチャルリピート項目と同様です。私は問題を説明するためにcodepenの例を作成しました。 CSSまたはangularJsに基づくあらゆる解決策が大いに評価されるでしょう。

http://codepen.io/pyella/pen/XpXaEJ

編集1：私は私のリストのように固定されたDOM要素をレンダリングするために、無限スクロールを実現するためのコンセプトのこの証明をしようとしているパフォーマンスを引き起こす可能性があり、実際に多数（レンダリングされる10000 DOM要素）を含んでいてもよいですCPUの問題があり、この実証で、巨大なデータをレンダリングするために角度を使用する人は、角度のある素材を使用してパフォーマンスの問題を避けることができます。

注：月包装容器を表示するには、表示された年のいずれかをクリックしてください。現在、高さは250pxにハードコードされており、高さは100％で、月ラッパーコンテナは表示されません。

ヶ月ラッパーの高さは、それが

.virtualRepeatdemoScrollTo #months-wrapper { 
/* height: 100%;*/ 
    /*position: initial;*/ 
} 

.virtualRepeatdemoScrollTo .md-virtual-repeat-container { 
    height: 250px; 
} 

Answer 1

ラッパーヶ月は、私は、これはあなたが達成したいものですが、ここではcodepen編集されているかどうかわからないんだけど表示されませんアンコメントしている場合：http://codepen.io/anon/pen/zNBrJg

私はその前のpositionがabsoluteしていて、その親がnだった理由だった

.md-virtual-repeat-scroller{ 
    position: initial !important; 
} 

を追加しました調整高さ。

height: 100%ルールを.virtualRepeatdemoScrollTo #vertical-containerセレクタから削除しました。