How do I use Reactive Forms in Angular 18 without NgModules

I am building a new app using Angular 18.

> ng version
...
Angular CLI: 18.2.12
...


It is a standalone app (with routing), no NgModules and no app.modules.ts file.

I want to use Reactive Forms.

In my component class I have declared

import { FormControl, FormGroup } from '@angular/forms';


and

public foobarForm = new FormGroup({
foo: new FormControl(''),
bar: new FormControl(''),
});


In my HTML file, I have

<form [formGroup]="foobarForm">
<input type="text" id="foo" name="foo" [formControl]="foo" placeholder="Foo" />
<input type="text" id="bar" name="bar" [formControl]="bar" placeholder="Bar" />
...
</form>


I get the following errors

Can't bind to 'formGroup' since it isn't a known property of 'form'
​

and

Can't bind to 'formControl' since it isn't a known property of 'input'.
​

Looking art the official docs (at https://angular.dev/guide/forms/reactive-forms), it looks like I have to import ReactiveFormsModule in my app.modules.ts. But I do not have one.

What is the correct way to use Reactive Forms in a standalone app with version > 17 ?

Continue reading...