I developed a component using angular that I embed in clients sites. I want the component to span minimally until the end of the viewport. each of the sites has a different size header and the headers doesn't share a tag/class/id. I need to add min-height value to the app that equals to viewport height - header height and that way, even if the content of my component wont be enough to reach the bottom of the viewport, the min-height will enforce it spanning all the way to it.

previously I handled those problems with the following JS code

var component= document.getElementById("component")
component.minHeight = Window.innerHeight - component.getBoundingClientRect().top

but that doesn't work in angular...

any idea how can I make this work?