角2 ElementRef nativeElement offsetWidth总是0

Question

我需要获得具有动态宽度的元素的宽度，我可以使用纯javascript获得宽度，而不是角2。

constructor(private element: ElementRef) {
// ....

获得宽度

let width =  this.element.nativeElement.offsetWidth;

console.log('js offset width', document.getElementById('foobar').offsetWidth);
console.log('angular2 offset width', width);

这样做很好：

document.getElementById('foobar').offsetWidth 

但不是角2的宽度，它总是0。那么，如何通过角的ElementRef获得偏移宽度呢？

Answer 1

您没有将TemplateRef与任何DOM元素关联

@ViewChild('foo') foo: TemplateRef;

将HTML中的属性设为

 <div #foo></div>

现在，OnInit试图得到值，它将是一个非零。

现场演示