docs(forms): migrate @whatItDoes tags to the description (#23186)

We get the overview for the doc by splitting off the first
paragraph.

PR Close #23186

packages/forms/src/directives/reactive_directives/form_control_directive.ts

@@ -29,15 +29,15 @@ export const formControlBinding: any = {
 };
 
 /**
- * @whatItDoes Syncs a standalone {@link FormControl} instance to a form control element.
+ * @description
  *
- * In other words, this directive ensures that any values written to the {@link FormControl}
+ * Syncs a standalone {@link FormControl} instance to a form control element.
+ *
+ * This directive ensures that any values written to the {@link FormControl}
  * instance programmatically will be written to the DOM element (model -> view). Conversely,
  * any values written to the DOM element through user input will be reflected in the
  * {@link FormControl} instance (view -> model).
  *
- * @description
- *
  * Use this directive if you'd like to create and manage a {@link FormControl} instance directly.
  * Simply create a {@link FormControl}, save it to your component class, and pass it into the
  * {@link FormControlDirective}.

packages/forms/src/directives/reactive_directives/form_control_name.ts

@@ -28,16 +28,16 @@ export const controlNameBinding: any = {
 };
 
 /**
- * @whatItDoes  Syncs a {@link FormControl} in an existing {@link FormGroup} to a form control
+ * @description
+ *
+ * Syncs a {@link FormControl} in an existing {@link FormGroup} to a form control
  * element by name.
  *
- * In other words, this directive ensures that any values written to the {@link FormControl}
+ * This directive ensures that any values written to the {@link FormControl}
  * instance programmatically will be written to the DOM element (model -> view). Conversely,
  * any values written to the DOM element through user input will be reflected in the
  * {@link FormControl} instance (view -> model).
  *
- * @description
- *
  * This directive is designed to be used with a parent {@link FormGroupDirective} (selector:
  * `[formGroup]`).
  *

packages/forms/src/directives/reactive_directives/form_group_directive.ts

@@ -23,10 +23,10 @@ export const formDirectiveProvider: any = {
 };
 
 /**
- * @whatItDoes Binds an existing {@link FormGroup} to a DOM element.
- *
  * @description
  *
+ * Binds an existing {@link FormGroup} to a DOM element.
+ *
  * This directive accepts an existing {@link FormGroup} instance. It will then use this
  * {@link FormGroup} instance to match any child {@link FormControl}, {@link FormGroup},
  * and {@link FormArray} instances to child {@link FormControlName}, {@link FormGroupName},

packages/forms/src/directives/reactive_directives/form_group_name.ts

@@ -24,10 +24,10 @@ export const formGroupNameProvider: any = {
 };
 
 /**
- * @whatItDoes Syncs a nested {@link FormGroup} to a DOM element.
- *
  * @description
  *
+ * Syncs a nested {@link FormGroup} to a DOM element.
+ *
  * This directive can only be used with a parent {@link FormGroupDirective} (selector:
  * `[formGroup]`).
  *
@@ -95,10 +95,10 @@ export const formArrayNameProvider: any = {
 };
 
 /**
- * @whatItDoes Syncs a nested {@link FormArray} to a DOM element.
- *
  * @description
  *
+ * Syncs a nested {@link FormArray} to a DOM element.
+ *
  * This directive is designed to be used with a parent {@link FormGroupDirective} (selector:
  * `[formGroup]`).
  *