Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

mat select multi with virtual scroll loses context of selection

See original GitHub issue

What is the expected behavior?

cdk-virtual-scroll-viewport inside mat select with multiple should persist selected values.

What is the current behavior?

When selecting and scrolling, when items are out of render buffer the list loses it selected context.

What are the steps to reproduce?

https://stackblitz.com/edit/angular-material2-issue-gvgfxs Select Description 120 - 123 and scroll away, when returning to items they are deselected.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

"@angular/animations": "7.2.11" "@angular/cdk": "^7.3.6" "@angular/common": "7.2.11" "@angular/compiler": "7.2.11" "@angular/compiler-cli": "7.2.11" "@angular/core": "7.2.11" "@angular/forms": "7.2.11" "@angular/http": "7.2.11" "@angular/material": "^7.3.6" "@angular/platform-browser": "7.2.11" "@angular/platform-browser-dynamic": "7.2.11" "@angular/platform-server": "7.2.11" "@angular/router": "7.2.11" "typescript": "3.2.4" "zone.js": "^0.8.29"

OS: Linux_x64 Browser: Chrome

Issue Analytics

State:
Created 4 years ago
Reactions:4
Comments:11 (1 by maintainers)

Top GitHub Comments

6reactions

kburns1commented, Dec 17, 2019

I have a workaround for this but it should be definetely addressed asap.

Best.

Same here. I am stuck on this. Any insight into the work around?

5reactions

aalbericiocommented, Jun 20, 2019

I have a workaround for this but it should be definetely addressed asap.

Best.

Top Results From Across the Web

Cdk virtual-scroll inside mat-select for mat-option

The virtual scroll viewport needs a size in order to know, how big the scroll container must be. This can be done by...

Angular Mat Select Virtual Scroll - StackBlitz

A project based on rxjs, tslib, core-js, zone.js, @angular/cdk, @angular/core, @angular/forms, @angular/common, @angular/router, @angular/compiler, ...

Virtual scrolling in a mat-select dropdown using a nested form ...

To overcome this issue, we have to conditionally create the mat-option with the selected value of the zip code if any. That's it...

InjectionToken mat-select-scroll-strategy

cdk-virtual-scroll-viewport inside mat select with multiple should persist ... when items are out of render buffer the list loses it selected context.

Tech: Implement Virtual Scrolling with MatList in Angular

In the template above, we bind two new attributes to mat-list-option, value and selected, to control the state of the checkboxes. Add ...