How to get width of (DOM) Element in Angular2

Question

there a some similiar threads but I couldn\'t find a suitable answer for my needs. So that direct DOM access should be strictly avoided in angular2 I\'m just wondering whats

Answer 1

I don't know a way to get the width from the host element without accessing nativeElement but setting could be done like:

@HostListener('window:resize', ['$event.target']) 
onResize() { 
  this.resizeWorks();
}

@HostBinding('style.height.px')
elHeight:number;

private resizeWorks(): void {
  this.elHeight = this.el.nativeElement.width;
}

If you can add an element inside your components template like

then this would work without direct DOM access at all (but not after init).