Question

我看了很多帖子，但没有一个人做我想做的事。我有一张超出页面宽度的桌子，出于各种原因我需要得到它的宽度。

我用过：

@ViewChild('tableToMeasure') elementView: ElementRef;

然后将#tableToMeasure放在桌面上。然而，这似乎是错误的：

ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'nativeElement' of undefined

即使这只适用于页面的父div，也只能在页面的父div上使用。

有什么想法吗？我需要在页面加载和页面调整大小时获得它的宽度，并将另一个divs宽度更改为相同的值。

Answer 1

@Component({
    selector: 'selector',
    template: `<button #tableToMeasure>Click me</button>`
})
export class FeatureComponent implements AfterViewInit {

    @ViewChild('tableToMeasure') elementView;

    constructor() {
    }

    ngAfterViewInit() {
        console.log(this.elementView.nativeElement);
    }
}

Answer 2

我遇到了同样的问题。我发现的解决方案实际上相当容易;它返回undefined，因为在你的HTML文件中没有任何定义为＆＃39; tableToMeasure＆＃39;。

因此，您必须将#tableToMeasure添加到HTML元素中。

示例代码HTML文件：

<div #tableToMeasure style="width: 100px; height: 100px">
   <span>Some content!</span
</div>

在你的TypeScript文件中：

@ViewChild('tableToMeasure')elementView: ElementRef;

确保从@angular/core导入ViewChild和ElementRef。

祝你好运！

Angular 2获取div的宽度

2 个答案: