Угловое 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; 
    } 
}