將 FormControl 綁定到指令中的輸入

Question

我無法通過附加到輸入的指令內的 HostBinding 將 formControl 添加到輸入。 請讓我知道這是否是一種可能的方法，如果可以，該怎么做。

輸入

<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);
        });
    }
}