docs: fix invalid headings (#24000)

PR Close #24000

packages/core/src/change_detection/change_detector_ref.ts

@@ -16,6 +16,7 @@ export abstract class ChangeDetectorRef {
    *
    * <!-- TODO: Add a link to a chapter on OnPush components -->
    *
+   * @usageNotes
    * ### Example
    *
    * ```typescript
@@ -50,6 +51,7 @@ export abstract class ChangeDetectorRef {
    * <!-- TODO: Add a link to a chapter on detach/reattach/local digest -->
    * <!-- TODO: Add a live demo once ref.detectChanges is merged into master -->
    *
+   * @usageNotes
    * ### Example
    *
    * The following example defines a component with a large list of readonly data.
@@ -102,9 +104,8 @@ export abstract class ChangeDetectorRef {
    * <!-- TODO: Add a link to a chapter on detach/reattach/local digest -->
    * <!-- TODO: Add a live demo once ref.detectChanges is merged into master -->
    *
-   * ### Example
+   * @usageNotes
    *
-   * The following example defines a component with a large list of readonly data.
    * Imagine, the data changes constantly, many times per second. For performance reasons,
    * we want to check and update the list every five seconds.
    *
@@ -131,6 +132,7 @@ export abstract class ChangeDetectorRef {
    *
    * <!-- TODO: Add a link to a chapter on detach/reattach/local digest -->
    *
+   * @usageNotes
    * ### Example
    *
    * The following example creates a component displaying `live` data. The component will detach

packages/core/src/change_detection/differs/iterable_differs.ts

@@ -162,12 +162,13 @@ export class IterableDiffers {
    * inherited {@link IterableDiffers} instance with the provided factories and return a new
    * {@link IterableDiffers} instance.
    *
+   * @usageNotes
+   * ### Example
+   *
    * The following example shows how to extend an existing list of factories,
    * which will only be applied to the injector for this component and its children.
    * This step is all that's required to make a new {@link IterableDiffer} available.
    *
-   * ### Example
-   *
    * ```
    * @Component({
    *   viewProviders: [

packages/core/src/change_detection/differs/keyvalue_differs.ts

@@ -135,12 +135,13 @@ export class KeyValueDiffers {
    * inherited {@link KeyValueDiffers} instance with the provided factories and return a new
    * {@link KeyValueDiffers} instance.
    *
+   * @usageNotes
+   * ### Example
+   *
    * The following example shows how to extend an existing list of factories,
    * which will only be applied to the injector for this component and its children.
    * This step is all that's required to make a new {@link KeyValueDiffer} available.
    *
-   * ### Example
-   *
    * ```
    * @Component({
    *   viewProviders: [

packages/core/src/change_detection/pipe_transform.ts

@@ -12,10 +12,7 @@
  * Angular invokes the `transform` method with the value of a binding
  * as the first argument, and any parameters as the second argument in list form.
  *
- * ## Syntax
- *
- * `value | pipeName[:arg0[:arg1...]]`
- *
+ * @usageNotes
  * ### Example
  *
  * The `RepeatPipe` below repeats the value as many times as indicated by the first argument: