HostBinding связывает FormControl с входом в директиве

Question

У меня проблемы с добавлением formControl к входу через HostBinding внутри директивы, прикрепленной к входу. Пожалуйста, дайте мне знать, если это возможный подход, и если да, то как это сделать.

Ввод

<input matInput searchInput>

Директива (searchInput)

@Directive({
    selector: '[searchInput]',
})
export class SearchableSelectDirective implements AfterViewInit {
    @HostBinding('attr.[formControl]') control: FormControl = new FormControl('');

    ngAfterViewInit(): void {
        this.sub = this.control.valueChanges.subscribe((value: string) => {
            console.log(value);
        });
    }
}

Answer 1

Для доступа к справке FormControl вам необходимо использовать NgControl

@Directive({
    selector: '[searchInput]',
})
export class SearchableSelectDirective implements AfterViewInit {
    sub: any;
    constructor(private ngControl: NgControl) {}

    ngAfterViewInit(): void {
        this.sub = this.ngControl.valueChanges.subscribe((value: string) => {
            console.log(value);
        });
    }
}