div class="router-container"안에 있는 경우 scrollTop이 작동하지 않음

3624 단어 angulartypescript
div class="router-container"안에 있는 경우 scrollTop이 작동하지 않음<div class="router-container" cdkScrollable>
<router-outlet></router-outlet>
</div>
.router-container {
overflow: auto;
background-color: rgb($base-color-white);
}

새 구성요소

`<매트 테이블

table id="overview-trfList-tbl" name="overview-trfList-tbl" (matSortChange)="sortData($event)" [dataSource]="dataSource" matSort class="테이블 높이 입력 최소 간격 테이블 -플렉스 개요 테이블">



    <!-- Name Column -->
      <ng-container matColumnDef="Name">
        <mat-header-cell *matHeaderCellDef  #nameSpan  sortActionDescription="Sort by Name" id="overview-trfList-header-name-btn" name="overview-trfList-header-name-btn">
        <span mat-sort-header id="overview-trfList-header-name-lbl" name="overview-trfList-header-name-lbl" >Name</span>
        <span #nameColumnFilterOverlay (click)="onNameFilterIconClicked($event)" id="overview-trfList-header-name-filter" name="overview-trfList-header-name-filter" class="overlay-icon">
          <span *ngIf="(displayNameFilterIcon || isNameFilterOverlayPopUpOpen) && !filterNameString"
            class="mat-tbl-icon icon-filter" matTooltipClass="tooltip-style" matTooltipPosition=above
            matTooltip="Filter name"></span>
          <span *ngIf="filterNameString" class="mat-tbl-icon icon-Filter-Applied"matTooltipClass="tooltip-style" matTooltipPosition=above
          matTooltip="Filter name active"></span>
        </span>
        </mat-header-cell>
        <mat-cell *matCellDef="let element; let i = index;">
          <div class="vertical-context" matTooltipClass="tooltip-style" matTooltipPosition=above [id]="'overview-trfList-name-val-'+ i" [name]="'overview-trfList-name-val-'+ i"
          matTooltip="{{element.Name}}" >{{element.Name}}</div>
        </mat-cell>
      </ng-container>  


[id]="'overview-trfList-row-'+ i"[이름]="'overview-trfList-row-'+ i"
[routerLink]="['view',row.Code]"[class.selected]="selection.isSelected(row)">


  <div *ngIf="!dataSource.data || (dataSource.data.length === 0)" class="no-method overview-mt" id="overview-trfList-nodata-div" name="overview-trfList-nodata-div">
    <p id="overview-trfList-nodata-lbl" name="overview-trfList-nodata-lbl" [innerHtml]="NoData | linebreak" ></p>
  </div>
  <mat-paginator (page)="test()" #paginator id="overview-trf-table-pagination" name="overview-trf-table-pagination" [pageSize]="50" [pageSizeOptions]="[50, 100, 200]" showFirstLastButtons="true">
  </mat-paginator>`

TS 파일.public test(): void {
let mm = document.querySelector('.mat-sidenav-content');
mm.scrollTop = 0;
}

위 코드 작동하지 않음
<div class="router-container" cdkScrollable>를 제거하면 작동하지만 이 Div가 필요합니다.

내 요구 사항 scrollTop은 div와 함께 작동해야 합니다.

좋은 웹페이지 즐겨찾기