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

时间:2016-05-24 16:15:13

标签: angular angular2-directives

我试图创建一个流体文本区域,但是当使用"角度2方式"我无法在元素上设置高度。做DOM操作。

组件:

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上的高度没有设置?

1 个答案:

答案 0 :(得分:4)

如果您在

中使用@HostBinding('style.height.px')
this.height = this._elementRef.nativeElement.scrollHeight + 'px';

你应该在这里添加

@HostBinding('style.height')

使用

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

pg_ctl -D /usr/local/var/postgres -l /usr/local/var/postgres/server.log start