Question

我正在用角度为6的代码使用表格。行数是几百个。所以我用过infinityScroll（一个插件）。所以我的滚动条链接到表格，即表格的正文而不是页面。我在ALERT TYPE列中使用排序，所以每当我要进行排序时，我都希望表格到达位置[0,0]，即排序操作将导致表格到达其初始位置（表格顶部）

我曾经使用过 ViewportScroller 从@ angular / common导入。因此，当我使用其方法getScrollPosition（）时，它给了我整个页面正输出而不是表格滚动位置的信息。帮帮我。我希望滚动位置如下表所示。

<table class="table table_view_land alertable" matSort
   (matSortChange)="sortData($event);">
   <thead *ngIf="tableShowFlag">
      <tr>
         <th></th>
         <th></th>
         <th mat-sort-header="name">Alert Type      
         </th>
         <th>DESCRIPTION</th>
         <th>status</th>
         <th>last Modified</th>
         <th>attachments</th>
         <th>people</th>
         <th>action</th>
      </tr>
   </thead>
   <tbody class='main-panel'
   infiniteScroll
   [infiniteScrollDistance]="2"
   [infiniteScrollUpDistance]="1.5"
   [infiniteScrollThrottle]="100"
   [infiniteScrollContainer]= "selector"
   [fromRoot]="true"
   (scrolled)="onScrollDown()"
   (scrolledUp)="onScrollUp()"   *ngIf='tableData'>
   <tr *ngFor="let data of sortedData">
      <td>{{data.subject}}</td>
      <td>{{data.description}}</td>
      <td>{{data.caseStatusName}}</td>
      <td>{{data.lastupdate | date : "short" }}</td>
      <td>{{data.activityContentPath.length}}</td>
      <td>{{data.watcherCount}}</td>
      <td>Windows 10 Pro</td>
   </tr>
   <div class="spinLoader" [ng2-loading]="showSpinScroll" [config]="loadingConfig" align="center">
   <!-- <mat-progress-spinner *ngIf="showSpinScroll" class="example-margin" [color]="color" [mode]="mode" [diameter]='diameter'>
      </mat-progress-spinner> -->
   </div>
   </tbody>
</table>

我已尝试解决自己的问题并卡住了她。我认为我的解决方案在下面的代码中。

static ngInjectableDef: defineInjectable({ 
     providedIn: 'root',
     factory: () => new BrowserViewportScroller(inject(DOCUMENT), window) 
 })
abstract setOffset(offset: [number, number] | (() => [number, number])): void
abstract getScrollPosition(): [number, number]
abstract scrollToPosition(position: [number, number]): void
abstract scrollToAnchor(anchor: string): void
abstract setHistoryScrollRestoration(scrollRestoration: 'auto' | 'manual'): void

Answer 1

我认为您没有在构造函数中注入ViewportScroller。

获取带有角度6 ViewportScroller的滚动的当前位置

1 个答案: