Setting dynamic height for Angular CDK virtual scroll viewport

Question

I'm working on Angular table with usage of cdk Virtual Scroll. Do you know if there is any way to set the dynamic height of scroll viewport? Everything works fine with standard style property but I can't set the value using ngStyle. I would be grateful for any help.

score 0 · Answer 1 · answered Feb 05 '20 at 18:13

What you can do, try pass Height of viewport you want, as a @Input to your Component. Second option that comes to my mind is you could try to pass as ElementRef component it self in constructor:

constructor (private _elementRef: ElementRef){ ... }

And then take its Parent Height, in, for example ngOnInit:

const elHeight = this._elementRef.nativeElement.parentElement.offsetHeight;

Hope it helps.

Setting dynamic height for Angular CDK virtual scroll viewport

1 Answers1