如何在运行时调整DOM元素的大小

Question

在Angular 2项目中，我正在尝试调整我通过id检索的DOM元素。 我设置下面列出的大小，我没有观察到任何变化。 我错过了什么步骤？

        document.getElementById('my_grid').setAttribute("style","height:600px");

Answer 1

不要这样使用。您可以使用角度2功能。

1. 您可以使用[style.height.px]="modelvalue"
2. 第二种方式，您可以在html中使用<div #mydiv>并在组件中使用@ViewChild
例

@ViewChild mydiv;

resizeDiv() {
    this.mydiv.nativeElement...
}

Answer 2

您需要将高度设置为<div>元素。您的浏览器无法解释Angular指令的height属性。

此外，访问DOM中元素的首选方法是通过@ViewChild装饰器。见accessing native elements in angular2

Answer 3

在角度2中，尽可能永远不要使用核心javascript或jquery代码来操作dom元素。首先尝试使用角度2功能。

我们可以使用[style.height.px]="height"以及每当您想要从组件

更改div高度更改高度值时