Reactive PrimeNG AutoComplete Control

Using a PrimeNG (v12.1.0-rc.2) AutoComplete control is a matter of adding a formControlName (see line 5) attribute on the p-autoComplete component.

The setValue/getValue methods will set and get the current selected value of the control. You must use the suggestions attribute to populate the drop down values.

Note, you will have to import FormsModule and ReactiveformsModule.

Source code can be found at GitHub.

Then in the TypeScript code,

  • Wire up the control on lines 25-27
  • Set selected value on line 26
  • To react to changes in the selected value see line 46
Dan