Как я могу получить доступ к своему элементу управления формой, который встроен в мой компонент?

#angular #angular-content-projection

Вопрос:

У меня есть родительский компонент. Внутри него я проецирую входные данные.

 <app-form-field>
  <input #input [id]="autoCompleteSearchInput" type="text" autoComplete="off"
   class='input-underline search-bar idented-text' [placeholder]="placeholder" 
   [formControl]="search" />
</app-form-field>
 

Так что у меня есть этот контроль

 [formControl]="search"
 

теперь я не могу найти способ доступа к контенту, введенному в FormControl, из моего appformfieldкомпонента.

Я попробовал использовать HTML

    <ng-content select=".input-underline"></ng-content>
 

тс

  @ContentChild(FormControlName, {static: false}) formControl: FormControlName;

ngAfterContentInit() {
  console.log(this.formControl);
}
 

но это дает мне неопределенность.

Как я могу получить доступ к этому элементу управления формой, чтобы знать, что вводится внутри ввода моего компонента ?

Ответ №1:

Вы используете [formControl] , поэтому вы должны использовать FormControlDirective в своем @ContentChild :

 @ContentChild(FormControlDirective, {static: false})
formControl?: FormControlDirective;

ngAfterContentInit() {
  console.log(this.formControl);
}
 

Комментарии:

1. Спасибо вам за ваши отзывы. Но когда я пытаюсь в ngAfterContentInit получить значение через valuechanges — я не получаю значения, которые я вводил в свой ввод. this.FormControl.valueChanges.subscribe(x => { console.log(‘chiplist’, x); })

2. Как я могу получить доступ к значению ?