Angular 2 在指令中检测对只读输入的 [ngModel] 绑定的更改

Question

我有这个指令，该指令根据其内容设置了文本方面的流体高度：

@Directive({
  selector: '[fluidHeight]',
  host: {
    '(ngModelChange)': 'setHeight()'
  }
})
export class FluidHeightDirective implements AfterViewInit {
  constructor(private elementRef: ElementRef) {}
  ngAfterViewInit() {
    this.setHeight();
  }
  @HostBinding('style.height.px')
  height: number;
  setHeight() {
    console.log(true)
    this.height = this.elementRef.nativeElement.scrollHeight;
  }
}

但是，当我将[ngModel]与readonly一起使用时，我无法使其正常工作：

<textarea [ngModel]="foo" fluidHeight readonly></textarea>

还有另一个更改 readonly输入内容的文本方面。

我尝试使用ngModelChange，change和input，但它们似乎都没有用。

有人知道该怎么做吗？

Answer 1

设置器应该做技巧：

export class FluidHeightDirective implements AfterViewInit {
    @Input('fluidHeight')
    set content(content:any) {
        this.setHeight();
    }
    constructor(private elementRef: ElementRef) {}
    ngAfterViewInit() {
        this.setHeight();
    }
    @HostBinding('style.height.px')
    height: number;
    setHeight() {
        console.log(true);
        this.height = this.elementRef.nativeElement.scrollHeight;
    }
}