angular / angular/components

feat(cdk/scrolling): ScrollToIndexIfNeeded function

Offen
#21,522 3 Kommentare 3 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen
area: cdk/scrolling feature P3
Vorherrschende Sprache
TypeScript
Sterne
25k
Forks
6.8k
Ø Merge
1 T. 8 Std.
Gemergte PRs (30 T.)
91

Beschreibung

#### Feature Description

We have `scrollToIndex` function on `CdkVirtualScrollViewport`. But we cannot determine whenever an index is or is not withing **visible** viewport.

```ts
const viewPort: CdkVirtualScrollViewport;

scrollToIndex(index: number): void {
const range = viewPort.getRenderedRange();

if (range.start > index || range.end < index) {
// Scroll is 100% needed.
viewPort.scrollToIndex(index, 'auto');
} else {
// The index is within range, but not necessarily within visible viewport!
// From my testing I have +-8 items above and bellow at the time
}
}
```

#### Use Case

It would enable scrolling to an item if only needed.

#### Note

If there was `CdkVirtualScrollViewport.getVisibleRange`, we could even scroll our desired element to the middle of the viewport!

Beitragsleitfaden

Beitragsleitfaden öffnen

Rechercherichtung

Beginne mit CdkVirtualScrollViewport, insbesondere mit den vorhandenen Einstiegspunkten scrollToIndex und getRenderedRange. Ermittle, wie ein sichtbarer Bereich offengelegt oder verwendet werden könnte, um unnötiges Scrollen zu vermeiden, einschließlich des angeforderten Anwendungsfalls für die Mitte des Viewports. Als erledigt gilt die Aufgabe, wenn der Viewport nur dann zu einem Index scrollen kann, wenn dieser außerhalb des sichtbaren Viewports liegt.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
angular, typescript
Bereich
frontend
Issue-Typ
Feature
Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
35/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.