不使用Angular 2指令在元素上设置高度

Question

我正在尝试创建一个流体textarea，但在使用执行DOM操作的“角度2方法”时，无法获取要设置在元素上的高度。

组件：

import {Directive, ElementRef, HostBinding, HostListener} from '@angular/core'; 

@Directive({ 
    selector: '[fluidHeight]', 
    host: { 
    '(input)': 'setHeight()' 
    } 
}) 

export class FluidHeightDirective { 

    constructor(private _elementRef: ElementRef) {} 

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

    setHeight() { 
    this.height = this._elementRef.nativeElement.scrollHeight + 'px'; 
    } 
} 

标记：

<textarea [(ngModel)]="model" fluidHeight></textarea> 

为什么我得到的setHeight功能的正确值，但高度不可正对textarea设置？

Answer 1

如果您在

@HostBinding('style.height.px') 

使用.px你应该不其添加在这里以及

this.height = this._elementRef.nativeElement.scrollHeight + 'px'; 

二者必选其一

@HostBinding('style.height') 

或

this.height = this._elementRef.nativeElement.scrollHeight;