docs: set syntax highlighting to the remaining Markdown code examples blocks (#59088)

There are some code blocks that slipped through the initial Regex-es.

Related to #59026

PR Close #59088

packages/common/http/src/request.ts

@@ -170,7 +170,7 @@ export class HttpRequest<T> {
    * To pass a string representation of HTTP parameters in the URL-query-string format,
    * the `HttpParamsOptions`' `fromString` may be used. For example:
    *
-   * ```
+   * ```ts
    * new HttpParams({fromString: 'angular=awesome'})
    * ```
    */

packages/common/src/directives/ng_optimized_image/ng_optimized_image.ts

@@ -318,7 +318,7 @@ export class NgOptimizedImage implements OnInit, OnChanges {
    * descriptors to generate the final `srcset` property of the image.
    *
    * Example:
-   * ```
+   * ```html
    * <img ngSrc="hello.jpg" ngSrcset="100w, 200w" />  =>
    * <img src="path/hello.jpg" srcset="path/hello.jpg?w=100 100w, path/hello.jpg?w=200 200w" />
    * ```

packages/compiler-cli/src/ngtsc/diagnostics/src/error_code.ts

@@ -273,7 +273,7 @@ export enum ErrorCode {
    * The left-hand side of an assignment expression was a template variable. Effectively, the
    * template looked like:
    *
-   * ```
+   * ```html
    * <ng-template let-something>
    *   <button (click)="something = ...">...</button>
    * </ng-template>

packages/compiler-cli/src/ngtsc/reflection/src/host.ts

@@ -153,7 +153,7 @@ export interface ClassMember {
    *
    * For example, the TS code:
    *
-   * ```
+   * ```ts
    * class Clazz {
    *   static get property(): string {
    *     return 'value';
@@ -163,7 +163,7 @@ export interface ClassMember {
    *
    * Downlevels to:
    *
-   * ```
+   * ```ts
    * var Clazz = (function () {
    *   function Clazz() {
    *   }
@@ -182,7 +182,7 @@ export interface ClassMember {
    * Object.defineProperty ExpressionStatement, but the implementation would be this
    * FunctionDeclaration:
    *
-   * ```
+   * ```ts
    * function () {
    *   return 'value';
    * },
@@ -624,7 +624,7 @@ export interface ReflectionHost {
    * If the declaration is in a different module, and that module is imported via an absolute path,
    * this method also returns the absolute path of the imported module. For example, if the code is:
    *
-   * ```
+   * ```ts
    * import {RouterModule} from '@angular/core';
    *
    * export const ROUTES = RouterModule.forRoot([...]);

packages/compiler-cli/src/ngtsc/reflection/src/typescript.ts

@@ -319,13 +319,13 @@ export class TypeScriptReflectionHost implements ReflectionHost {
    *
    * For example, if the identifier is the `Directive` part of a qualified type chain like:
    *
-   * ```
+   * ```ts
    * core.Directive
    * ```
    *
    * then it might be that `core` is a namespace import such as:
    *
-   * ```
+   * ```ts
    * import * as core from 'tslib';
    * ```
    *

packages/compiler-cli/src/ngtsc/typecheck/api/symbols.ts

@@ -190,7 +190,7 @@ export interface ReferenceSymbol {
   /**
    * The location in the shim file of a variable that holds the type of the local ref.
    * For example, a reference declaration like the following:
-   * ```
+   * ```ts
    * var _t1 = document.createElement('div');
    * var _t2 = _t1; // This is the reference declaration
    * ```

packages/compiler/src/core.ts

@@ -221,12 +221,12 @@ export const enum AttributeMarker {
    * ## Example:
    *
    * Given:
-   * ```
-   * <div class="foo bar baz">...<d/vi>
+   * ```html
+   * <div class="foo bar baz">...</div>
    * ```
    *
    * the generated code is:
-   * ```
+   * ```ts
    * var _c1 = [AttributeMarker.Classes, 'foo', 'bar', 'baz'];
    * ```
    */
@@ -240,12 +240,12 @@ export const enum AttributeMarker {
    * ## Example:
    *
    * Given:
-   * ```
+   * ```html
    * <div style="width:100px; height:200px; color:red">...</div>
    * ```
    *
    * the generated code is:
-   * ```
+   * ```ts
    * var _c1 = [AttributeMarker.Styles, 'width', '100px', 'height'. '200px', 'color', 'red'];
    * ```
    */
@@ -256,13 +256,13 @@ export const enum AttributeMarker {
    *
    * For example, given the following HTML:
    *
-   * ```
+   * ```html
    * <div moo="car" [foo]="exp" (bar)="doSth()">
    * ```
    *
    * the generated code is:
    *
-   * ```
+   * ```ts
    * var _c1 = ['moo', 'car', AttributeMarker.Bindings, 'foo', 'bar'];
    * ```
    */
@@ -273,7 +273,7 @@ export const enum AttributeMarker {
    *
    * For example, given the following HTML:
    *
-   * ```
+   * ```html
    * <div *ngFor="let value of values; trackBy:trackBy" dirA [dirB]="value">
    * ```
    *
@@ -298,7 +298,7 @@ export const enum AttributeMarker {
    *
    * For example, given the following HTML:
    *
-   * ```
+   * ```html
    * <h1 attr="value" ngProjectAs="[title]">
    * ```
    *
@@ -315,14 +315,15 @@ export const enum AttributeMarker {
    *
    * For example, given the following HTML:
    *
-   * ```
+   * ```html
    * <div moo="car" foo="value" i18n-foo [bar]="binding" i18n-bar>
    * ```
    *
    * the generated code is:
    *
-   * ```
+   * ```ts
    * var _c1 = ['moo', 'car', AttributeMarker.I18n, 'foo', 'bar'];
+   * ```
    */
   I18n = 6,
 }

packages/compiler/src/expression_parser/parser.ts

@@ -176,7 +176,7 @@ export class Parser {
    * parsing errors in case the given expression is invalid.
    *
    * For example,
-   * ```
+   * ```html
    *   <div *ngFor="let item of items">
    *         ^      ^ absoluteValueOffset for `templateValue`
    *         absoluteKeyOffset for `templateKey`
@@ -187,7 +187,7 @@ export class Parser {
    * 3. ngForOf -> items
    *
    * This is apparent from the de-sugared template:
-   * ```
+   * ```html
    *   <ng-template ngFor let-item [ngForOf]="items">
    * ```
    *
@@ -1215,7 +1215,7 @@ class _ParseAST {
    * parsing errors in case the given expression is invalid.
    *
    * For example,
-   * ```
+   * ```html
    *   <div *ngFor="let item of items; index as i; trackBy: func">
    * ```
    * contains five bindings:

packages/compiler/src/render3/view/api.ts

@@ -156,7 +156,7 @@ export const enum DeclarationListEmitMode {
   /**
    * The list of declarations is emitted into the generated code as is.
    *
-   * ```
+   * ```ts
    * directives: [MyDir],
    * ```
    */
@@ -166,7 +166,7 @@ export const enum DeclarationListEmitMode {
    * The list of declarations is emitted into the generated code wrapped inside a closure, which
    * is needed when at least one declaration is a forward reference.
    *
-   * ```
+   * ```ts
    * directives: function () { return [MyDir, ForwardDir]; },
    * ```
    */
@@ -180,13 +180,13 @@ export const enum DeclarationListEmitMode {
    * any forward references within the list are resolved when the outer closure is invoked.
    *
    * Consider the case where the runtime has captured two declarations in two distinct values:
-   * ```
+   * ```ts
    * const dirA = MyDir;
    * const dirB = forwardRef(function() { return ForwardRef; });
    * ```
    *
    * This mode would emit the declarations captured in `dirA` and `dirB` as follows:
-   * ```
+   * ```ts
    * directives: function () { return [dirA, dirB].map(ng.resolveForwardRef); },
    * ```
    */

packages/compiler/src/shadow_css.ts

@@ -214,7 +214,7 @@ export class ShadowCss {
    *
    * For example, we convert this css:
    *
-   * ```
+   * ```scss
    * .box {
    *   animation: box-animation 1s forwards;
    * }
@@ -228,7 +228,7 @@ export class ShadowCss {
    *
    * to this:
    *
-   * ```
+   * ```scss
    * .box {
    *   animation: scopeName_box-animation 1s forwards;
    * }
@@ -262,7 +262,7 @@ export class ShadowCss {
    *
    * For example, it takes a rule such as:
    *
-   * ```
+   * ```scss
    * @keyframes box-animation {
    *   to {
    *     background-color: green;
@@ -272,7 +272,7 @@ export class ShadowCss {
    *
    * and returns:
    *
-   * ```
+   * ```scss
    * @keyframes scopeName_box-animation {
    *   to {
    *     background-color: green;

packages/compiler/src/template_parser/binding_parser.ts

@@ -263,7 +263,7 @@ export class BindingParser {
 
   /**
    * Parses the bindings in a microsyntax expression, e.g.
-   * ```
+   * ```html
    *    <tag *tplKey="let value1 = prop; let value2 = localVar">
    * ```
    *

packages/core/src/application/application_ref.ts

@@ -116,7 +116,7 @@ export interface BootstrapOptions {
    * Optionally specify coalescing event change detections or not.
    * Consider the following case.
    *
-   * ```
+   * ```html
    * <div (click)="doSomething()">
    *   <button (click)="doSomethingElse()"></button>
    * </div>
@@ -140,7 +140,7 @@ export interface BootstrapOptions {
    * into a single change detection.
    *
    * Consider the following case.
-   * ```
+   * ```ts
    * for (let i = 0; i < 10; i ++) {
    *   ngZone.run(() => {
    *     // do something

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

@@ -222,7 +222,7 @@ export class IterableDiffers {
    * 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.
    *
-   * ```
+   * ```ts
    * @Component({
    *   viewProviders: [
    *     IterableDiffers.extend([new ImmutableListDiffer()])

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

@@ -155,7 +155,7 @@ export class KeyValueDiffers {
    * 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.
    *
-   * ```
+   * ```ts
    * @Component({
    *   viewProviders: [
    *     KeyValueDiffers.extend([new ImmutableMapDiffer()])

packages/core/src/change_detection/scheduling/ng_zone_scheduling.ts

@@ -181,7 +181,7 @@ export interface NgZoneOptions {
    * Optionally specify coalescing event change detections or not.
    * Consider the following case.
    *
-   * ```
+   * ```html
    * <div (click)="doSomething()">
    *   <button (click)="doSomethingElse()"></button>
    * </div>
@@ -204,7 +204,7 @@ export interface NgZoneOptions {
    * into a single change detection.
    *
    * Consider the following case.
-   * ```
+   * ```ts
    * for (let i = 0; i < 10; i ++) {
    *   ngZone.run(() => {
    *     // do something

packages/core/src/metadata/ng_module.ts

@@ -57,7 +57,7 @@ export interface NgModule {
    * The following example defines a class that is injected in
    * the HelloWorld NgModule:
    *
-   * ```
+   * ```ts
    * class Greeter {
    *    greet(name:string) {
    *      return 'Hello ' + name + '!';

packages/core/src/pending_tasks.ts

@@ -107,7 +107,7 @@ export class PendingTasks {
   /**
    * Runs an asynchronous function and blocks the application's stability until the function completes.
    *
-   * ```
+   * ```ts
    * pendingTasks.run(async () => {
    *   const userData = await fetch('/api/user');
    *   this.userData.set(userData);
@@ -117,7 +117,7 @@ export class PendingTasks {
    * Application stability is at least delayed until the next tick after the `run` method resolves
    * so it is safe to make additional updates to application state that would require UI synchronization:
    *
-   * ```
+   * ```ts
    * const userData = await pendingTasks.run(() => fetch('/api/user'));
    * this.userData.set(userData);
    * ```

packages/core/src/render3/definition.ts

@@ -242,7 +242,7 @@ interface ComponentDefinition<T> extends Omit<DirectiveDefinition<T>, 'features'
    *
    * This function has following structure.
    *
-   * ```
+   * ```ts
    * function Template<T>(ctx:T, creationMode: boolean) {
    *   if (creationMode) {
    *     // Contains creation mode instructions.

packages/core/src/render3/instructions/i18n_icu_container_visitor.ts

@@ -74,7 +74,7 @@ export function loadIcuContainerVisitor() {
    * to determine which root belong to the ICU.
    *
    * Example of usage.
-   * ```
+   * ```ts
    * const nextRNode = icuContainerIteratorStart(tIcuContainerNode, lView);
    * let rNode: RNode|null;
    * while(rNode = nextRNode()) {

packages/core/src/render3/interfaces/attribute_marker.ts

@@ -34,12 +34,12 @@ export const enum AttributeMarker {
    * ## Example:
    *
    * Given:
-   * ```
-   * <div class="foo bar baz">...<d/vi>
+   * ```html
+   * <div class="foo bar baz">...</div>
    * ```
    *
    * the generated code is:
-   * ```
+   * ```ts
    * var _c1 = [AttributeMarker.Classes, 'foo', 'bar', 'baz'];
    * ```
    */
@@ -53,12 +53,12 @@ export const enum AttributeMarker {
    * ## Example:
    *
    * Given:
-   * ```
+   * ```html
    * <div style="width:100px; height:200px; color:red">...</div>
    * ```
    *
    * the generated code is:
-   * ```
+   * ```ts
    * var _c1 = [AttributeMarker.Styles, 'width', '100px', 'height'. '200px', 'color', 'red'];
    * ```
    */
@@ -69,13 +69,13 @@ export const enum AttributeMarker {
    *
    * For example, given the following HTML:
    *
-   * ```
+   * ```html
    * <div moo="car" [foo]="exp" (bar)="doSth()">
    * ```
    *
    * the generated code is:
    *
-   * ```
+   * ```ts
    * var _c1 = ['moo', 'car', AttributeMarker.Bindings, 'foo', 'bar'];
    * ```
    */
@@ -86,7 +86,7 @@ export const enum AttributeMarker {
    *
    * For example, given the following HTML:
    *
-   * ```
+   * ```html
    * <div *ngFor="let value of values; trackBy:trackBy" dirA [dirB]="value">
    * ```
    *
@@ -112,13 +112,13 @@ export const enum AttributeMarker {
    *
    * For example, given the following HTML:
    *
-   * ```
+   * ```html
    * <h1 attr="value" ngProjectAs="[title]">
    * ```
    *
    * the generated code for the `element()` instruction would include:
    *
-   * ```
+   * ```ts
    * ['attr', 'value', AttributeMarker.ProjectAs, ['', 'title', '']]
    * ```
    */
@@ -129,14 +129,15 @@ export const enum AttributeMarker {
    *
    * For example, given the following HTML:
    *
-   * ```
+   * ```html
    * <div moo="car" foo="value" i18n-foo [bar]="binding" i18n-bar>
    * ```
    *
    * the generated code is:
    *
-   * ```
+   * ```ts
    * var _c1 = ['moo', 'car', AttributeMarker.I18n, 'foo', 'bar'];
+   * ```
    */
   I18n = 6,
 }

packages/core/src/render3/interfaces/injector.ts

@@ -202,7 +202,7 @@ export class NodeInjectorFactory {
    * Example:
    *
    * If we have a component and directive active an a single element as declared here
-   * ```
+   * ```ts
    * component:
    *   providers: [ {provide: String, useValue: 'component', multi: true} ],
    *   viewProviders: [ {provide: String, useValue: 'componentView', multi: true} ],
@@ -213,7 +213,7 @@ export class NodeInjectorFactory {
    *
    * Then the expected results are:
    *
-   * ```
+   * ```ts
    * providers: ['component', 'directive']
    * viewProviders: ['component', 'componentView', 'directive']
    * ```
@@ -238,7 +238,7 @@ export class NodeInjectorFactory {
    * Example:
    *
    * Given:
-   * ```
+   * ```ts
    * providers: [ {provide: String, useValue: 'all', multi: true} ],
    * viewProviders: [ {provide: String, useValue: 'viewOnly', multi: true} ],
    * ```

packages/core/src/render3/interfaces/node.ts

@@ -244,7 +244,7 @@ export interface TNode {
    * such a case the value stores an array of text nodes to insert.
    *
    * Example:
-   * ```
+   * ```html
    * <div i18n>
    *   Hello <span>World</span>!
    * </div>
@@ -257,7 +257,7 @@ export interface TNode {
    * `<span>` itself.
    *
    * Pseudo code:
-   * ```
+   * ```ts
    *   if (insertBeforeIndex === null) {
    *     // append as normal
    *   } else if (Array.isArray(insertBeforeIndex)) {
@@ -490,12 +490,12 @@ export interface TNode {
    *
    * For easier discussion assume this example:
    * `<parent>`'s view definition:
-   * ```
+   * ```html
    * <child id="c1">content1</child>
    * <child id="c2"><span>content2</span></child>
    * ```
    * `<child>`'s view definition:
-   * ```
+   * ```html
    * <ng-content id="cont1"></ng-content>
    * ```
    *
@@ -558,7 +558,7 @@ export interface TNode {
    * styling than the instruction.
    *
    * Imagine:
-   * ```
+   * ```angular-ts
    * <div style="color: highest;" my-dir>
    *
    * @Directive({

packages/core/src/render3/interfaces/view.ts

@@ -139,7 +139,7 @@ export interface LView<T = unknown> extends Array<any> {
    * Store the `TNode` of the location where the current `LView` is inserted into.
    *
    * Given:
-   * ```
+   * ```html
    * <div>
    *   <ng-template><span></span></ng-template>
    * </div>
@@ -154,7 +154,7 @@ export interface LView<T = unknown> extends Array<any> {
    * insertion information in the `TView` and instead we must store it in the `LView[T_HOST]`.
    *
    * So to determine where is our insertion parent we would execute:
-   * ```
+   * ```ts
    * const parentLView = lView[PARENT];
    * const parentTNode = lView[T_HOST];
    * const insertionParent = parentLView[parentTNode.index];
@@ -249,7 +249,7 @@ export interface LView<T = unknown> extends Array<any> {
    * `DECLARATION_VIEW`.
    *
    * Example:
-   * ```
+   * ```html
    * <#VIEW #myComp>
    *  <div *ngIf="true">
    *   <ng-template #myTmpl>...</ng-template>
@@ -274,7 +274,7 @@ export interface LView<T = unknown> extends Array<any> {
    * `DECLARATION_COMPONENT_VIEW` to differentiate them. As in this example.
    *
    * Example showing intra component `LView` movement.
-   * ```
+   * ```html
    * <#VIEW #myComp>
    *   <div *ngIf="condition; then thenBlock else elseBlock"></div>
    *   <ng-template #thenBlock>Content to render when condition is true.</ng-template>
@@ -284,7 +284,7 @@ export interface LView<T = unknown> extends Array<any> {
    * The `thenBlock` and `elseBlock` is moved but not transplanted.
    *
    * Example showing inter component `LView` movement (transplanted view).
-   * ```
+   * ```html
    * <#VIEW #myComp>
    *   <ng-template #myTmpl>...</ng-template>
    *   <insertion-component [template]="myTmpl"></insertion-component>

packages/core/src/render3/state.ts

@@ -176,7 +176,7 @@ interface InstructionState {
    * directives on children of that element.
    *
    * Example:
-   * ```
+   * ```html
    * <my-comp my-directive>
    *   Should match component / directive.
    * </my-comp>
@@ -193,7 +193,7 @@ interface InstructionState {
    * Stores the root TNode that has the 'ngSkipHydration' attribute on it for later reference.
    *
    * Example:
-   * ```
+   * ```html
    * <my-comp ngSkipHydration>
    *   Should reference this root node
    * </my-comp>

packages/forms/src/directives/abstract_control_directive.ts

@@ -278,7 +278,7 @@ export abstract class AbstractControlDirective {
    * @usageNotes
    * For example, for the following `FormGroup`:
    *
-   * ```
+   * ```ts
    * form = new FormGroup({
    *   address: new FormGroup({ street: new FormControl() })
    * });
@@ -312,7 +312,7 @@ export abstract class AbstractControlDirective {
    * @usageNotes
    * For example, for the following `FormGroup`:
    *
-   * ```
+   * ```ts
    * form = new FormGroup({
    *   address: new FormGroup({ street: new FormControl() })
    * });

packages/forms/src/model/abstract_model.ts

@@ -1430,7 +1430,7 @@ export abstract class AbstractControl<TValue = any, TRawValue extends TValue = T
    *
    * ### Manually set the errors for a control
    *
-   * ```
+   * ```ts
    * const login = new FormControl('someLogin');
    * login.setErrors({
    *   notUnique: true
@@ -1532,7 +1532,7 @@ export abstract class AbstractControl<TValue = any, TRawValue extends TValue = T
    * @usageNotes
    * For example, for the following `FormGroup`:
    *
-   * ```
+   * ```ts
    * form = new FormGroup({
    *   address: new FormGroup({ street: new FormControl() })
    * });
@@ -1564,7 +1564,7 @@ export abstract class AbstractControl<TValue = any, TRawValue extends TValue = T
    * @usageNotes
    * For example, for the following `FormGroup`:
    *
-   * ```
+   * ```ts
    * form = new FormGroup({
    *   address: new FormGroup({ street: new FormControl() })
    * });

packages/forms/src/model/form_array.ts

@@ -273,7 +273,7 @@ export class FormArray<TControl extends AbstractControl<any> = any> extends Abst
    * @usageNotes
    * ### Set the values for the controls in the form array
    *
-   * ```
+   * ```ts
    * const arr = new FormArray([
    *   new FormControl(),
    *   new FormControl()
@@ -322,7 +322,7 @@ export class FormArray<TControl extends AbstractControl<any> = any> extends Abst
    * @usageNotes
    * ### Patch the values for controls in a form array
    *
-   * ```
+   * ```ts
    * const arr = new FormArray([
    *    new FormControl(),
    *    new FormControl()
@@ -388,7 +388,7 @@ export class FormArray<TControl extends AbstractControl<any> = any> extends Abst
    *
    * ### Reset the values in a form array and the disabled status for the first control
    *
-   * ```
+   * ```ts
    * arr.reset([
    *   {value: 'name', disabled: true},
    *   'last'

packages/forms/src/model/form_group.ts

@@ -381,7 +381,7 @@ export class FormGroup<
    * @usageNotes
    * ### Set the complete value for the form group
    *
-   * ```
+   * ```ts
    * const form = new FormGroup({
    *   first: new FormControl(),
    *   last: new FormControl()
@@ -437,7 +437,7 @@ export class FormGroup<
    * @usageNotes
    * ### Patch the value for a form group
    *
-   * ```
+   * ```ts
    * const form = new FormGroup({
    *    first: new FormControl(),
    *    last: new FormControl()
@@ -528,7 +528,7 @@ export class FormGroup<
    *
    * ### Reset the form group values and disabled status
    *
-   * ```
+   * ```ts
    * const form = new FormGroup({
    *   first: new FormControl('first name'),
    *   last: new FormControl('last name')

packages/localize/src/localize/src/localize.ts

@@ -28,7 +28,7 @@ export interface LocalizeFn {
    *
    * The compile-time translation inliner is able to replace the following code:
    *
-   * ```
+   * ```ts
    * typeof $localize !== "undefined" && $localize.locale
    * ```
    *

packages/platform-browser/animations/src/module.ts

@@ -46,7 +46,7 @@ export class BrowserAnimationsModule {
    * @usageNotes
    * When registering the `BrowserAnimationsModule`, you can use the `withConfig`
    * function as follows:
-   * ```
+   * ```ts
    * @NgModule({
    *   imports: [BrowserAnimationsModule.withConfig(config)]
    * })

packages/platform-browser/src/browser/tools/common_tools.ts

@@ -39,7 +39,7 @@ export class AngularProfiler {
    * `record` (boolean) - causes the profiler to record a CPU profile while
    * it exercises the change detector. Example:
    *
-   * ```
+   * ```ts
    * ng.profiler.timeChangeDetection({record: true})
    * ```
    */

packages/router/src/directives/router_link_active.ts

@@ -143,7 +143,7 @@ export class RouterLinkActive implements OnChanges, OnDestroy, AfterContentInit
    * true  -> Route is active
    * false -> Route is inactive
    *
-   * ```
+   * ```html
    * <a
    *  routerLink="/user/bob"
    *  routerLinkActive="active-link"

packages/router/src/models.ts

@@ -974,8 +974,7 @@ export type CanActivateChildFn = (
  * Here, the defined guard function is provided as part of the `Route` object
  * in the router configuration:
  *
- * ```
- *
+ * ```ts
  * @Injectable()
  * class CanDeactivateTeam implements CanDeactivate<TeamComponent> {
  *   constructor(private permissions: Permissions, private currentUser: UserToken) {}
@@ -1071,8 +1070,7 @@ export type CanDeactivateFn<T> = (
  * Here, the defined guard function is provided as part of the `Route` object
  * in the router configuration:
  *
- * ```
- *
+ * ```ts
  * @NgModule({
  *   imports: [
  *     RouterModule.forRoot([
@@ -1151,8 +1149,7 @@ export type CanMatchFn = (route: Route, segments: UrlSegment[]) => MaybeAsync<Gu
  * Here, the defined `resolve()` function is provided as part of the `Route` object
  * in the router configuration:
  *
- * ```
-
+ * ```ts
  * @NgModule({
  *   imports: [
  *     RouterModule.forRoot([
@@ -1363,8 +1360,7 @@ export type ResolveFn<T> = (
  * Here, the defined guard function is provided as part of the `Route` object
  * in the router configuration:
  *
- * ```
- *
+ * ```ts
  * @NgModule({
  *   imports: [
  *     RouterModule.forRoot([
@@ -1497,7 +1493,7 @@ export interface NavigationBehaviorOptions {
    * This feature is useful for redirects, such as redirecting to an error page, without changing
    * the value that will be displayed in the browser's address bar.
    *
-   * ```
+   * ```ts
    * const canActivate: CanActivateFn = (route: ActivatedRouteSnapshot) => {
    *   const userService = inject(UserService);
    *   const router = inject(Router);

packages/router/src/navigation_transition.ts

@@ -124,7 +124,7 @@ export interface UrlCreationOptions {
    * The following `go()` function navigates to the `list` route by
    * interpreting the destination URI as relative to the activated `child`  route
    *
-   * ```
+   * ```ts
    *  @Component({...})
    *  class ChildComponent {
    *    constructor(private router: Router, private route: ActivatedRoute) {}

packages/router/src/router.ts

@@ -355,7 +355,7 @@ export class Router {
    *
    * @usageNotes
    *
-   * ```
+   * ```ts
    * router.resetConfig([
    *  { path: 'team/:id', component: TeamCmp, children: [
    *    { path: 'simple', component: SimpleCmp },
@@ -498,7 +498,7 @@ export class Router {
    *
    * The following calls request navigation to an absolute path.
    *
-   * ```
+   * ```ts
    * router.navigateByUrl("/team/33/user/11");
    *
    * // Navigate without updating the URL
@@ -540,7 +540,7 @@ export class Router {
    *
    * The following calls request navigation to a dynamic route path relative to the current URL.
    *
-   * ```
+   * ```ts
    * router.navigate(['team', 33, 'user', 11], {relativeTo: route});
    *
    * // Navigate without updating the URL, overriding the default behavior

packages/router/src/router_module.ts

@@ -120,7 +120,7 @@ export class RouterModule {
    *
    * When registering the NgModule at the root, import as follows:
    *
-   * ```
+   * ```ts
    * @NgModule({
    *   imports: [RouterModule.forRoot(ROUTES)]
    * })
@@ -171,7 +171,7 @@ export class RouterModule {
    * without creating a new Router service.
    * When registering for submodules and lazy-loaded submodules, create the NgModule as follows:
    *
-   * ```
+   * ```ts
    * @NgModule({
    *   imports: [RouterModule.forChild(ROUTES)]
    * })

packages/router/src/router_state.ts

@@ -349,7 +349,7 @@ export class ActivatedRouteSnapshot {
      *  You can compute all params (or data) in the router state or to get params outside
      *  of an activated component by traversing the `RouterState` tree as in the following
      *  example:
-     *  ```
+     *  ```ts
      *  collectRouteParams(router: Router) {
      *    let params = {};
      *    let stack: ActivatedRouteSnapshot[] = [router.routerState.snapshot.root];

packages/upgrade/src/dynamic/src/upgrade_adapter.ts

@@ -198,7 +198,7 @@ export class UpgradeAdapter {
    *
    * ### Example
    *
-   * ```
+   * ```angular-ts
    * const adapter = new UpgradeAdapter(forwardRef(() => MyNg2Module));
    * const module = angular.module('myExample', []);
    * module.directive('greet', adapter.downgradeNg2Component(Greeter));
@@ -277,7 +277,7 @@ export class UpgradeAdapter {
    *
    * ### Example
    *
-   * ```
+   * ```angular-ts
    * const adapter = new UpgradeAdapter(forwardRef(() => MyNg2Module));
    * const module = angular.module('myExample', []);
    *
@@ -327,7 +327,7 @@ export class UpgradeAdapter {
    * @usageNotes
    * ### Example
    *
-   * ```
+   * ```ts
    * const upgradeAdapter = new UpgradeAdapter(MyNg2Module);
    *
    * // configure the adapter with upgrade/downgrade components and services
@@ -386,7 +386,7 @@ export class UpgradeAdapter {
    * @usageNotes
    * ### Example
    *
-   * ```
+   * ```angular-ts
    * const adapter = new UpgradeAdapter(MyNg2Module);
    * const module = angular.module('myExample', []);
    * module.directive('ng2', adapter.downgradeNg2Component(Ng2));
@@ -467,7 +467,7 @@ export class UpgradeAdapter {
    * @usageNotes
    * ### Example
    *
-   * ```
+   * ```ts
    * class Login { ... }
    * class Server { ... }
    *
@@ -507,7 +507,7 @@ export class UpgradeAdapter {
    * @usageNotes
    * ### Example
    *
-   * ```
+   * ```ts
    * class Example {
    * }
    *
@@ -538,7 +538,7 @@ export class UpgradeAdapter {
    * @usageNotes
    * ### Example
    *
-   * ```
+   * ```ts
    * const upgradeAdapter = new UpgradeAdapter(MyNg2Module);
    * upgradeAdapter.declareNg1Module(['heroApp']);
    * ```

packages/zone.js/lib/zone.configurations.api.ts

@@ -22,7 +22,7 @@ declare global {
      *
      * Consider the following example:
      *
-     * ```
+     * ```ts
      * const EventEmitter = require('events');
      * class MyEmitter extends EventEmitter {}
      * const myEmitter = new MyEmitter();
@@ -52,7 +52,7 @@ declare global {
      *
      * Consider the following example:
      *
-     * ```
+     * ```ts
      * const fs = require('fs');
      *
      * const zone = Zone.current.fork({name: 'myZone'});
@@ -80,7 +80,7 @@ declare global {
      *
      * Consider the following example:
      *
-     * ```
+     * ```ts
      * const zone = Zone.current.fork({name: 'myZone'});
      * zone.run(() => {
      *   setTimeout(() => {
@@ -106,7 +106,7 @@ declare global {
      *
      * Consider the following example:
      *
-     * ```
+     * ```ts
      * const zone = Zone.current.fork({name: 'myZone'});
      * zone.run(() => {
      *   process.nextTick(() => {
@@ -132,7 +132,7 @@ declare global {
      *
      * Consider the following example:
      *
-     * ```
+     * ```ts
      * const crypto = require('crypto');
      *
      * const zone = Zone.current.fork({name: 'myZone'});
@@ -182,7 +182,7 @@ declare global {
      *
      * Consider the following example:
      *
-     * ```
+     * ```ts
      * const proto = Object.create(HTMLElement.prototype);
      * proto.createdCallback = function() {
      *   console.log('createdCallback is invoked in the zone', Zone.current.name);
@@ -225,7 +225,7 @@ declare global {
      *
      * Consider the following example:
      *
-     * ```
+     * ```ts
      * const zone = Zone.current.fork({name: 'myZone'});
      * zone.run(() => {
      *   div.addEventListener('click', () => {
@@ -251,7 +251,7 @@ declare global {
      *
      * Consider the following example:
      *
-     * ```
+     * ```ts
      * const zone = Zone.current.fork({name: 'myZone'});
      * zone.run(() => {
      *   setTimeout(() => {
@@ -279,7 +279,7 @@ declare global {
      *
      * Consider the following example:
      *
-     * ```
+     * ```ts
      * const zone = Zone.current.fork({name: 'myZone'});
      * zone.run(() => {
      *   requestAnimationFrame(() => {
@@ -310,7 +310,7 @@ declare global {
      *
      * Consider the following example:
      *
-     * ```
+     * ```ts
      * const zone = Zone.current.fork({name: 'myZone'});
      * zone.run(() => {
      *   queueMicrotask(() => {
@@ -342,7 +342,7 @@ declare global {
      *
      * Consider the following example:
      *
-     * ```
+     * ```ts
      * const zone = Zone.current.fork({name: 'myZone'});
      * zone.run(() => {
      *   div.addEventListener('click', () => {
@@ -382,7 +382,7 @@ declare global {
      *
      * Consider the following example:
      *
-     * ```
+     * ```ts
      * const zone = Zone.current.fork({name: 'myZone'});
      * zone.run(() => {
      *   div.onclick = () => {
@@ -407,7 +407,7 @@ declare global {
      *
      * Consider the following example:
      *
-     * ```
+     * ```ts
      * class TestCustomElement extends HTMLElement {
      *   constructor() { super(); }
      *   connectedCallback() {}
@@ -443,7 +443,7 @@ declare global {
      *
      * Consider the following example:
      *
-     * ```
+     * ```ts
      * const zone = Zone.current.fork({
      *   name: 'myZone',
      *   onScheduleTask: (delegate, curr, target, task) => {
@@ -477,7 +477,7 @@ declare global {
      *
      * Consider the following examples:
      *
-     * ```
+     * ```ts
      * const zone = Zone.current.fork({
      *   name: 'myZone'
      * });
@@ -506,7 +506,7 @@ declare global {
      *
      * Consider the following example:
      *
-     * ```
+     * ```ts
      * const zone = Zone.current.fork({
      *   name: 'myZone'
      * });
@@ -533,7 +533,7 @@ declare global {
      *
      * Consider the following examples:
      *
-     * ```
+     * ```ts
      * const zone = Zone.current.fork({name: 'myZone'});
      *
      * const p = Promise.resolve(1);
@@ -716,7 +716,7 @@ declare global {
      *
      * Consider the following example:
      *
-     * ```
+     * ```ts
      * describe('jasmine.clock integration', () => {
      *   beforeEach(() => {
      *     jasmine.clock().install();
@@ -749,7 +749,7 @@ declare global {
      *
      * Consider the following example:
      *
-     * ```
+     * ```ts
      * describe('jasmine.clock integration', () => {
      *   beforeEach(() => {
      *     jasmine.clock().install();
@@ -774,7 +774,7 @@ declare global {
      *
      * Consider the following example:
      *
-     * ```
+     * ```ts
      * describe('jasmine.clock integration', () => {
      *   beforeEach(() => {
      *     jasmine.clock().install();
@@ -803,7 +803,7 @@ declare global {
      *
      * Consider the following example:
      *
-     * ```
+     * ```ts
      * describe('wait never resolved promise', () => {
      *   it('async with never resolved promise test', async(() => {
      *     const p = new Promise(() => {});