第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

如何使用Angular Material表滾動(dòng)到特定頁(yè)面中的特定行

如何使用Angular Material表滾動(dòng)到特定頁(yè)面中的特定行

手掌心 2021-04-20 17:45:53
我正在使用有角材質(zhì)在頁(yè)面上以分頁(yè)顯示數(shù)據(jù),當(dāng)用戶單擊行時(shí),我將他重定向到另一頁(yè),如果他想返回到表格頁(yè),則單擊按鈕。我的問(wèn)題是用戶需要返回表格頁(yè)面并滾動(dòng)到特定行,我這樣做document.getElementById(elementId).scrollIntoView()但是如果單擊的行不在第一頁(yè)中,則找不到該元素,我如何分頁(yè)到該行所在的頁(yè)面?第二個(gè)問(wèn)題是用戶可以過(guò)濾表然后選擇特定的行,如果我保存頁(yè)碼,當(dāng)他返回表頁(yè)時(shí),數(shù)據(jù)將在沒(méi)有過(guò)濾器的情況下呈現(xiàn),并且頁(yè)碼將不正確
查看完整描述

2 回答

?
莫回?zé)o

TA貢獻(xiàn)1865條經(jīng)驗(yàn) 獲得超7個(gè)贊

您需要將分頁(yè)器與Angular的路由器連接。


例如,假設(shè)您按如下所示構(gòu)造了路徑路徑:


http://my/url/to/table/component?page=2

在這種情況下,您可以從URL到表中獲取頁(yè)面索引2,如下所示:


組件類(lèi)別:


class MyComponent {


  pageIndex = this.activatedRoute.queryParams.pipe(

    map(params => params['page'])

  );


  constructor(activatedRoute: ActivatedRoute) {}

}

模板:


<mat-paginator [pageIndex]="pageIndex | async"></mat-paginator>

到目前為止,URL將驅(qū)動(dòng)該表?,F(xiàn)在,當(dāng)用戶使用分頁(yè)器瀏覽表格時(shí),您還需要更新URL:


模板:


<mat-paginator [pageIndex]="pageIndex | async" (page)="pageChange($event)"></mat-paginator>

組件類(lèi)別:


class MyComponent {


  pageIndex = this.activatedRoute.queryParams.pipe(

    map(params => params['page'])

  )


  constructor(activatedRoute: ActivatedRoute, router: Router) {}


  pageChange(e: PageEvent): void {

    this.router.navigate( /* ... */ );

  }

}

現(xiàn)在,隨著用戶在表中瀏覽時(shí)URL正在更新,這使路由器可以在用戶返回到以前訪問(wèn)的URL時(shí)驅(qū)動(dòng)表。


查看完整回答
反對(duì) 回復(fù) 2021-04-29
  • 2 回答
  • 0 關(guān)注
  • 207 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)