docs(common): migrate @howToUse tags (#23062)

In pipes the content of these tags is now generated automatically.
In directives these tags have been converted to `@usageNotes` tags,
but in the future me might find a way to generate that usage too.

PR Close #23062

packages/common/src/directives/ng_class.ts

@@ -13,7 +13,7 @@ import {Directive, DoCheck, ElementRef, Input, IterableChanges, IterableDiffer,
  *
  * @whatItDoes Adds and removes CSS classes on an HTML element.
  *
- * @howToUse
+ * @usageNotes
  * ```
  *     <some-element [ngClass]="'first second'">...</some-element>
  *

packages/common/src/directives/ng_plural.ts

@@ -18,7 +18,7 @@ import {SwitchView} from './ng_switch';
  *
  * @whatItDoes Adds / removes DOM sub-trees based on a numeric value. Tailored for pluralization.
  *
- * @howToUse
+ * @usageNotes
  * ```
  * <some-element [ngPlural]="value">
  *   <ng-template ngPluralCase="=0">there is nothing</ng-template>
@@ -86,7 +86,7 @@ export class NgPlural {
  * @whatItDoes Creates a view that will be added/removed from the parent {@link NgPlural} when the
  *             given expression matches the plural expression according to CLDR rules.
  *
- * @howToUse
+ * @usageNotes
  * ```
  * <some-element [ngPlural]="value">
  *   <ng-template ngPluralCase="=0">...</ng-template>

packages/common/src/directives/ng_style.ts

@@ -13,7 +13,7 @@ import {Directive, DoCheck, ElementRef, Input, KeyValueChanges, KeyValueDiffer,
  *
  * @whatItDoes Update an HTML element styles.
  *
- * @howToUse
+ * @usageNotes
  * ```
  * <some-element [ngStyle]="{'font-style': styleExp}">...</some-element>
  *

packages/common/src/directives/ng_switch.ts

@@ -39,7 +39,7 @@ export class SwitchView {
  * @whatItDoes Adds / removes DOM sub-trees when the nest match expressions matches the switch
  *             expression.
  *
- * @howToUse
+ * @usageNotes
  * ```
  *     <container-element [ngSwitch]="switch_expression">
  *       <some-element *ngSwitchCase="match_expression_1">...</some-element>
@@ -133,7 +133,7 @@ export class NgSwitch {
  *             given expression evaluate to respectively the same/different value as the switch
  *             expression.
  *
- * @howToUse
+ * @usageNotes
  * ```
  * <container-element [ngSwitch]="switch_expression">
  *   <some-element *ngSwitchCase="match_expression_1">...</some-element>
@@ -173,7 +173,7 @@ export class NgSwitchCase implements DoCheck {
  * match the
  *             switch expression.
  *
- * @howToUse
+ * @usageNotes
  * ```
  * <container-element [ngSwitch]="switch_expression">
  *   <some-element *ngSwitchCase="match_expression_1">...</some-element>

packages/common/src/directives/ng_template_outlet.ts

@@ -13,7 +13,7 @@ import {Directive, EmbeddedViewRef, Input, OnChanges, SimpleChange, SimpleChange
  *
  * @whatItDoes Inserts an embedded view from a prepared `TemplateRef`
  *
- * @howToUse
+ * @usageNotes
  * ```
  * <ng-container *ngTemplateOutlet="templateRefExp; context: contextExp"></ng-container>
  * ```