Use offsetWidth & offsetHeight properties of the DOM element to get its the width and height.
The outerWidth() method returns the width of an element (includes padding and border).
I'm looking for a solution in Angular 4 to get the width of DOM element without taking any action (click or window resize), just after the page is loaded, but before I start to draw the svg. I've found a similar case in here but it doesn't work for me. I get the same error:
ERROR TypeError: Cannot read property 'nativeElement' of undefined
I need to get the width of div container to set veiwbox of svg I'm drawing inside it.
Here is the template:
<div id="what-is-the-width" class="svg-chart-container">
<svg [innerHTML]="svg"></svg>
</div>
and TS file with stuff needed in this case:
import { Component, Input, OnInit, ViewEncapsulation, AfterViewInit, ViewChild, ElementRef } from '@angular/core';
export class SvgChartComponent implements OnInit {
@ViewChild('what-is-the-width') elementView: ElementRef;
constructor() { }
ngAfterViewInit() {
console.log(this.elementView.nativeElement);
}
ngOnInit() {
//this method gets the data from the server and draw the svg
this.getSVGChartData();
}
}
Does anyone have ideas how to get this working?
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With