外部部品の内側のスクロールを角で表します。

Question

私は、googles official material designをAngularに実装しています。彼らのtabs componentの中にはいくつかのコンテンツがあり、タブの内容のスクロール位置を追跡する必要があります。

実際にスクロールするdivは、角度のある素材によって自動的に生成されるため、HTMLテンプレートにスクロールハンドラを追加することはできません。

テンプレート：

<md-tab-group> 
    <md-tab label="Tab 1">Content 1</md-tab> 
    <md-tab label="Tab 2">Content 2</md-tab> 
</md-tab-group> 

出力（短縮）：

<md-tab-group class="mat-tab-group"> 
    <md-tab-header class="mat-tab-header"> 
    <div class="mat-tab-list"> 
     <div class="mat-tab-labels">Tab 1</div> 
     <div class="mat-tab-labels">Tab 2</div> 
    </div> 
    </md-tab-header> 
    <div class="mat-tab-body-wrapper"> 
    <md-tab-body class="mat-tab-body"> 
     <div class="mat-tab-body-content"> 
     Content 1 
     </div> 
    </md-tab-body> 
    <md-tab-body class="mat-tab-body"> 
     <div class="mat-tab-body-content"> 
     Content 2 
     </div> 
    </md-tab-body> 
    </div> 
</md-tab-group> 

スクロールが.MAT-タブ体-コンテンツで、私はアクセスすることはできません -elementsを、たまたまテンプレートから。そこでスクロールを追跡する方法についてのアイデアはありますか？

Answer 1

私はあなたがコンポーネントのnativeElementを取得し、JavaScriptのquerySelector() -functionを使用することができ、これを解決してOK：this.elementRef.nativeElement.querySelector('.mat-tab-body-content')