UNPKG

@angular/router

Version:
1,445 lines (1,438 loc) 150 kB
/** * @license Angular v21.2.0 * (c) 2010-2026 Google LLC. https://angular.dev/ * License: MIT */ import * as i0 from '@angular/core'; import { InjectionToken, Signal, EnvironmentInjector, ComponentRef, EventEmitter, OnDestroy, OnInit, SimpleChanges, ProviderToken, Type, NgModuleFactory, Provider, EnvironmentProviders, OnChanges, Renderer2, ElementRef, AfterContentInit, QueryList, ChangeDetectorRef, ModuleWithProviders } from '@angular/core'; import { Observable } from 'rxjs'; import { LocationStrategy } from '@angular/common'; /** * Identifies the call or event that triggered a navigation. * * * 'imperative': Triggered by `router.navigateByUrl()` or `router.navigate()`. * * 'popstate' : Triggered by a `popstate` event. * * 'hashchange'-: Triggered by a `hashchange` event. * * @publicApi */ type NavigationTrigger = 'imperative' | 'popstate' | 'hashchange'; /** * Identifies the type of a router event. * * @see [Router Lifecycle and Events](guide/routing/lifecycle-and-events) * * @publicApi */ declare enum EventType { NavigationStart = 0, NavigationEnd = 1, NavigationCancel = 2, NavigationError = 3, RoutesRecognized = 4, ResolveStart = 5, ResolveEnd = 6, GuardsCheckStart = 7, GuardsCheckEnd = 8, RouteConfigLoadStart = 9, RouteConfigLoadEnd = 10, ChildActivationStart = 11, ChildActivationEnd = 12, ActivationStart = 13, ActivationEnd = 14, Scroll = 15, NavigationSkipped = 16 } /** * Base for events the router goes through, as opposed to events tied to a specific * route. Fired one time for any given navigation. * * The following code shows how a class subscribes to router events. * * ```ts * import {Event, RouterEvent, Router} from '@angular/router'; * * class MyService { * constructor(public router: Router) { * router.events.pipe( * filter((e: Event | RouterEvent): e is RouterEvent => e instanceof RouterEvent) * ).subscribe((e: RouterEvent) => { * // Do something * }); * } * } * ``` * * @see {@link Event} * @see [Router events summary](guide/routing/router-reference#router-events) * @publicApi */ declare class RouterEvent { /** A unique ID that the router assigns to every router navigation. */ id: number; /** The URL that is the destination for this navigation. */ url: string; constructor( /** A unique ID that the router assigns to every router navigation. */ id: number, /** The URL that is the destination for this navigation. */ url: string); } /** * An event triggered when a navigation starts. * * @publicApi */ declare class NavigationStart extends RouterEvent { readonly type = EventType.NavigationStart; /** * Identifies the call or event that triggered the navigation. * An `imperative` trigger is a call to `router.navigateByUrl()` or `router.navigate()`. * * @see {@link NavigationEnd} * @see {@link NavigationCancel} * @see {@link NavigationError} */ navigationTrigger?: NavigationTrigger; /** * The navigation state that was previously supplied to the `pushState` call, * when the navigation is triggered by a `popstate` event. Otherwise null. * * The state object is defined by `NavigationExtras`, and contains any * developer-defined state value, as well as a unique ID that * the router assigns to every router transition/navigation. * * From the perspective of the router, the router never "goes back". * When the user clicks on the back button in the browser, * a new navigation ID is created. * * Use the ID in this previous-state object to differentiate between a newly created * state and one returned to by a `popstate` event, so that you can restore some * remembered state, such as scroll position. * */ restoredState?: { [k: string]: any; navigationId: number; } | null; constructor( /** @docsNotRequired */ id: number, /** @docsNotRequired */ url: string, /** @docsNotRequired */ navigationTrigger?: NavigationTrigger, /** @docsNotRequired */ restoredState?: { [k: string]: any; navigationId: number; } | null); /** @docs-private */ toString(): string; } /** * An event triggered when a navigation ends successfully. * * @see {@link NavigationStart} * @see {@link NavigationCancel} * @see {@link NavigationError} * * @publicApi */ declare class NavigationEnd extends RouterEvent { /** @docsNotRequired */ urlAfterRedirects: string; readonly type = EventType.NavigationEnd; constructor( /** @docsNotRequired */ id: number, /** @docsNotRequired */ url: string, /** @docsNotRequired */ urlAfterRedirects: string); /** @docs-private */ toString(): string; } /** * A code for the `NavigationCancel` event of the `Router` to indicate the * reason a navigation failed. * * @publicApi */ declare enum NavigationCancellationCode { /** * A navigation failed because a guard returned a `UrlTree` to redirect. */ Redirect = 0, /** * A navigation failed because a more recent navigation started. */ SupersededByNewNavigation = 1, /** * A navigation failed because one of the resolvers completed without emitting a value. */ NoDataFromResolver = 2, /** * A navigation failed because a guard returned `false`. */ GuardRejected = 3, /** * A navigation was aborted by the `Navigation.abort` function. * * @see {@link Navigation} */ Aborted = 4 } /** * A code for the `NavigationSkipped` event of the `Router` to indicate the * reason a navigation was skipped. * * @publicApi */ declare enum NavigationSkippedCode { /** * A navigation was skipped because the navigation URL was the same as the current Router URL. */ IgnoredSameUrlNavigation = 0, /** * A navigation was skipped because the configured `UrlHandlingStrategy` return `false` for both * the current Router URL and the target of the navigation. * * @see {@link UrlHandlingStrategy} */ IgnoredByUrlHandlingStrategy = 1 } /** * An event triggered when a navigation is canceled, directly or indirectly. * This can happen for several reasons including when a route guard * returns `false` or initiates a redirect by returning a `UrlTree`. * * @see {@link NavigationStart} * @see {@link NavigationEnd} * @see {@link NavigationError} * * @publicApi */ declare class NavigationCancel extends RouterEvent { /** * A description of why the navigation was cancelled. For debug purposes only. Use `code` * instead for a stable cancellation reason that can be used in production. */ reason: string; /** * A code to indicate why the navigation was canceled. This cancellation code is stable for * the reason and can be relied on whereas the `reason` string could change and should not be * used in production. */ readonly code?: NavigationCancellationCode | undefined; readonly type = EventType.NavigationCancel; constructor( /** @docsNotRequired */ id: number, /** @docsNotRequired */ url: string, /** * A description of why the navigation was cancelled. For debug purposes only. Use `code` * instead for a stable cancellation reason that can be used in production. */ reason: string, /** * A code to indicate why the navigation was canceled. This cancellation code is stable for * the reason and can be relied on whereas the `reason` string could change and should not be * used in production. */ code?: NavigationCancellationCode | undefined); /** @docs-private */ toString(): string; } /** * An event triggered when a navigation is skipped. * This can happen for a couple reasons including onSameUrlHandling * is set to `ignore` and the navigation URL is not different than the * current state. * * @publicApi */ declare class NavigationSkipped extends RouterEvent { /** * A description of why the navigation was skipped. For debug purposes only. Use `code` * instead for a stable skipped reason that can be used in production. */ reason: string; /** * A code to indicate why the navigation was skipped. This code is stable for * the reason and can be relied on whereas the `reason` string could change and should not be * used in production. */ readonly code?: NavigationSkippedCode | undefined; readonly type = EventType.NavigationSkipped; constructor( /** @docsNotRequired */ id: number, /** @docsNotRequired */ url: string, /** * A description of why the navigation was skipped. For debug purposes only. Use `code` * instead for a stable skipped reason that can be used in production. */ reason: string, /** * A code to indicate why the navigation was skipped. This code is stable for * the reason and can be relied on whereas the `reason` string could change and should not be * used in production. */ code?: NavigationSkippedCode | undefined); } /** * An event triggered when a navigation fails due to an unexpected error. * * @see {@link NavigationStart} * @see {@link NavigationEnd} * @see {@link NavigationCancel} * * @publicApi */ declare class NavigationError extends RouterEvent { /** @docsNotRequired */ error: any; /** * The target of the navigation when the error occurred. * * Note that this can be `undefined` because an error could have occurred before the * `RouterStateSnapshot` was created for the navigation. */ readonly target?: RouterStateSnapshot | undefined; readonly type = EventType.NavigationError; constructor( /** @docsNotRequired */ id: number, /** @docsNotRequired */ url: string, /** @docsNotRequired */ error: any, /** * The target of the navigation when the error occurred. * * Note that this can be `undefined` because an error could have occurred before the * `RouterStateSnapshot` was created for the navigation. */ target?: RouterStateSnapshot | undefined); /** @docs-private */ toString(): string; } /** * An event triggered when routes are recognized. * * @publicApi */ declare class RoutesRecognized extends RouterEvent { /** @docsNotRequired */ urlAfterRedirects: string; /** @docsNotRequired */ state: RouterStateSnapshot; readonly type = EventType.RoutesRecognized; constructor( /** @docsNotRequired */ id: number, /** @docsNotRequired */ url: string, /** @docsNotRequired */ urlAfterRedirects: string, /** @docsNotRequired */ state: RouterStateSnapshot); /** @docs-private */ toString(): string; } /** * An event triggered at the start of the Guard phase of routing. * * @see {@link GuardsCheckEnd} * * @publicApi */ declare class GuardsCheckStart extends RouterEvent { /** @docsNotRequired */ urlAfterRedirects: string; /** @docsNotRequired */ state: RouterStateSnapshot; readonly type = EventType.GuardsCheckStart; constructor( /** @docsNotRequired */ id: number, /** @docsNotRequired */ url: string, /** @docsNotRequired */ urlAfterRedirects: string, /** @docsNotRequired */ state: RouterStateSnapshot); /** @docs-private */ toString(): string; } /** * An event triggered at the end of the Guard phase of routing. * * @see {@link GuardsCheckStart} * * @publicApi */ declare class GuardsCheckEnd extends RouterEvent { /** @docsNotRequired */ urlAfterRedirects: string; /** @docsNotRequired */ state: RouterStateSnapshot; /** @docsNotRequired */ shouldActivate: boolean; readonly type = EventType.GuardsCheckEnd; constructor( /** @docsNotRequired */ id: number, /** @docsNotRequired */ url: string, /** @docsNotRequired */ urlAfterRedirects: string, /** @docsNotRequired */ state: RouterStateSnapshot, /** @docsNotRequired */ shouldActivate: boolean); /** @docs-private */ toString(): string; } /** * An event triggered at the start of the Resolve phase of routing. * * Runs in the "resolve" phase whether or not there is anything to resolve. * In future, may change to only run when there are things to be resolved. * * @see {@link ResolveEnd} * * @publicApi */ declare class ResolveStart extends RouterEvent { /** @docsNotRequired */ urlAfterRedirects: string; /** @docsNotRequired */ state: RouterStateSnapshot; readonly type = EventType.ResolveStart; constructor( /** @docsNotRequired */ id: number, /** @docsNotRequired */ url: string, /** @docsNotRequired */ urlAfterRedirects: string, /** @docsNotRequired */ state: RouterStateSnapshot); /** @docs-private */ toString(): string; } /** * An event triggered at the end of the Resolve phase of routing. * @see {@link ResolveStart} * * @publicApi */ declare class ResolveEnd extends RouterEvent { /** @docsNotRequired */ urlAfterRedirects: string; /** @docsNotRequired */ state: RouterStateSnapshot; readonly type = EventType.ResolveEnd; constructor( /** @docsNotRequired */ id: number, /** @docsNotRequired */ url: string, /** @docsNotRequired */ urlAfterRedirects: string, /** @docsNotRequired */ state: RouterStateSnapshot); /** @docs-private */ toString(): string; } /** * An event triggered before lazy loading a route configuration. * * @see {@link RouteConfigLoadEnd} * * @publicApi */ declare class RouteConfigLoadStart { /** @docsNotRequired */ route: Route; readonly type = EventType.RouteConfigLoadStart; constructor( /** @docsNotRequired */ route: Route); /** @docs-private */ toString(): string; } /** * An event triggered when a route has been lazy loaded. * * @see {@link RouteConfigLoadStart} * * @publicApi */ declare class RouteConfigLoadEnd { /** @docsNotRequired */ route: Route; readonly type = EventType.RouteConfigLoadEnd; constructor( /** @docsNotRequired */ route: Route); /** @docs-private */ toString(): string; } /** * An event triggered at the start of the child-activation * part of the Resolve phase of routing. * @see {@link ChildActivationEnd} * @see {@link ResolveStart} * * @publicApi */ declare class ChildActivationStart { /** @docsNotRequired */ snapshot: ActivatedRouteSnapshot; readonly type = EventType.ChildActivationStart; constructor( /** @docsNotRequired */ snapshot: ActivatedRouteSnapshot); /** @docs-private */ toString(): string; } /** * An event triggered at the end of the child-activation part * of the Resolve phase of routing. * @see {@link ChildActivationStart} * @see {@link ResolveStart} * @publicApi */ declare class ChildActivationEnd { /** @docsNotRequired */ snapshot: ActivatedRouteSnapshot; readonly type = EventType.ChildActivationEnd; constructor( /** @docsNotRequired */ snapshot: ActivatedRouteSnapshot); /** @docs-private */ toString(): string; } /** * An event triggered at the start of the activation part * of the Resolve phase of routing. * @see {@link ActivationEnd} * @see {@link ResolveStart} * * @publicApi */ declare class ActivationStart { /** @docsNotRequired */ snapshot: ActivatedRouteSnapshot; readonly type = EventType.ActivationStart; constructor( /** @docsNotRequired */ snapshot: ActivatedRouteSnapshot); /** @docs-private */ toString(): string; } /** * An event triggered at the end of the activation part * of the Resolve phase of routing. * @see {@link ActivationStart} * @see {@link ResolveStart} * * @publicApi */ declare class ActivationEnd { /** @docsNotRequired */ snapshot: ActivatedRouteSnapshot; readonly type = EventType.ActivationEnd; constructor( /** @docsNotRequired */ snapshot: ActivatedRouteSnapshot); /** @docs-private */ toString(): string; } /** * An event triggered by scrolling. * * @publicApi */ declare class Scroll { /** @docsNotRequired */ readonly routerEvent: NavigationEnd | NavigationSkipped; /** @docsNotRequired */ readonly position: [number, number] | null; /** @docsNotRequired */ readonly anchor: string | null; /** @docsNotRequired */ readonly scrollBehavior?: "manual" | "after-transition" | undefined; readonly type = EventType.Scroll; constructor( /** @docsNotRequired */ routerEvent: NavigationEnd | NavigationSkipped, /** @docsNotRequired */ position: [number, number] | null, /** @docsNotRequired */ anchor: string | null, /** @docsNotRequired */ scrollBehavior?: "manual" | "after-transition" | undefined); /** @docs-private */ toString(): string; } /** * Router events that allow you to track the lifecycle of the router. * * The events occur in the following sequence: * * * [NavigationStart](api/router/NavigationStart): Navigation starts. * * [RouteConfigLoadStart](api/router/RouteConfigLoadStart): Before * the router [lazy loads](guide/routing/common-router-tasks#lazy-loading) a route configuration. * * [RouteConfigLoadEnd](api/router/RouteConfigLoadEnd): After a route has been lazy loaded. * * [RoutesRecognized](api/router/RoutesRecognized): When the router parses the URL * and the routes are recognized. * * [GuardsCheckStart](api/router/GuardsCheckStart): When the router begins the *guards* * phase of routing. * * [ChildActivationStart](api/router/ChildActivationStart): When the router * begins activating a route's children. * * [ActivationStart](api/router/ActivationStart): When the router begins activating a route. * * [GuardsCheckEnd](api/router/GuardsCheckEnd): When the router finishes the *guards* * phase of routing successfully. * * [ResolveStart](api/router/ResolveStart): When the router begins the *resolve* * phase of routing. * * [ResolveEnd](api/router/ResolveEnd): When the router finishes the *resolve* * phase of routing successfully. * * [ChildActivationEnd](api/router/ChildActivationEnd): When the router finishes * activating a route's children. * * [ActivationEnd](api/router/ActivationEnd): When the router finishes activating a route. * * [NavigationEnd](api/router/NavigationEnd): When navigation ends successfully. * * [NavigationCancel](api/router/NavigationCancel): When navigation is canceled. * * [NavigationError](api/router/NavigationError): When navigation fails * due to an unexpected error. * * [Scroll](api/router/Scroll): When the user scrolls. * * @publicApi */ type Event = NavigationStart | NavigationEnd | NavigationCancel | NavigationError | RoutesRecognized | GuardsCheckStart | GuardsCheckEnd | RouteConfigLoadStart | RouteConfigLoadEnd | ChildActivationStart | ChildActivationEnd | ActivationStart | ActivationEnd | Scroll | ResolveStart | ResolveEnd | NavigationSkipped; /** * The primary routing outlet. * * @publicApi */ declare const PRIMARY_OUTLET = "primary"; /** * A collection of matrix and query URL parameters. * @see {@link convertToParamMap} * @see {@link ParamMap} * * @publicApi */ type Params = { [key: string]: any; }; /** * A map that provides access to the required and optional parameters * specific to a route. * The map supports retrieving a single value with `get()` * or multiple values with `getAll()`. * * @see [URLSearchParams](https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams) * * @publicApi */ interface ParamMap { /** * Reports whether the map contains a given parameter. * @param name The parameter name. * @returns True if the map contains the given parameter, false otherwise. */ has(name: string): boolean; /** * Retrieves a single value for a parameter. * @param name The parameter name. * @return The parameter's single value, * or the first value if the parameter has multiple values, * or `null` when there is no such parameter. */ get(name: string): string | null; /** * Retrieves multiple values for a parameter. * @param name The parameter name. * @return An array containing one or more values, * or an empty array if there is no such parameter. * */ getAll(name: string): string[]; /** Names of the parameters in the map. */ readonly keys: string[]; } /** * Converts a `Params` instance to a `ParamMap`. * @param params The instance to convert. * @returns The new map instance. * * @publicApi */ declare function convertToParamMap(params: Params): ParamMap; /** * Matches the route configuration (`route`) against the actual URL (`segments`). * * When no matcher is defined on a `Route`, this is the matcher used by the Router by default. * * @param segments The remaining unmatched segments in the current navigation * @param segmentGroup The current segment group being matched * @param route The `Route` to match against. * * @see {@link UrlMatchResult} * @see {@link Route} * * @returns The resulting match information or `null` if the `route` should not match. * @publicApi */ declare function defaultUrlMatcher(segments: UrlSegment[], segmentGroup: UrlSegmentGroup, route: Route): UrlMatchResult | null; /** * An `InjectionToken` provided by the `RouterOutlet` and can be set using the `routerOutletData` * input. * * When unset, this value is `null` by default. * * @usageNotes * * To set the data from the template of the component with `router-outlet`: * ```html * <router-outlet [routerOutletData]="{name: 'Angular'}" /> * ``` * * To read the data in the routed component: * ```ts * data = inject(ROUTER_OUTLET_DATA) as Signal<{name: string}>; * ``` * * @publicApi * @see [Page routerOutletData](guide/routing/show-routes-with-outlets#passing-contextual-data-to-routed-components) */ declare const ROUTER_OUTLET_DATA: InjectionToken<Signal<unknown>>; /** * An interface that defines the contract for developing a component outlet for the `Router`. * * An outlet acts as a placeholder that Angular dynamically fills based on the current router state. * * A router outlet should register itself with the `Router` via * `ChildrenOutletContexts#onChildOutletCreated` and unregister with * `ChildrenOutletContexts#onChildOutletDestroyed`. When the `Router` identifies a matched `Route`, * it looks for a registered outlet in the `ChildrenOutletContexts` and activates it. * * @see {@link ChildrenOutletContexts} * @publicApi */ interface RouterOutletContract { /** * Whether the given outlet is activated. * * An outlet is considered "activated" if it has an active component. */ isActivated: boolean; /** The instance of the activated component or `null` if the outlet is not activated. */ component: Object | null; /** * The `Data` of the `ActivatedRoute` snapshot. */ activatedRouteData: Data; /** * The `ActivatedRoute` for the outlet or `null` if the outlet is not activated. */ activatedRoute: ActivatedRoute | null; /** * Called by the `Router` when the outlet should activate (create a component). */ activateWith(activatedRoute: ActivatedRoute, environmentInjector: EnvironmentInjector): void; /** * A request to destroy the currently activated component. * * When a `RouteReuseStrategy` indicates that an `ActivatedRoute` should be removed but stored for * later re-use rather than destroyed, the `Router` will call `detach` instead. */ deactivate(): void; /** * Called when the `RouteReuseStrategy` instructs to detach the subtree. * * This is similar to `deactivate`, but the activated component should _not_ be destroyed. * Instead, it is returned so that it can be reattached later via the `attach` method. */ detach(): ComponentRef<unknown>; /** * Called when the `RouteReuseStrategy` instructs to re-attach a previously detached subtree. */ attach(ref: ComponentRef<unknown>, activatedRoute: ActivatedRoute): void; /** * Emits an activate event when a new component is instantiated **/ activateEvents?: EventEmitter<unknown>; /** * Emits a deactivate event when a component is destroyed. */ deactivateEvents?: EventEmitter<unknown>; /** * Emits an attached component instance when the `RouteReuseStrategy` instructs to re-attach a * previously detached subtree. **/ attachEvents?: EventEmitter<unknown>; /** * Emits a detached component instance when the `RouteReuseStrategy` instructs to detach the * subtree. */ detachEvents?: EventEmitter<unknown>; /** * Used to indicate that the outlet is able to bind data from the `Router` to the outlet * component's inputs. * * When this is `undefined` or `false` and the developer has opted in to the * feature using `withComponentInputBinding`, a warning will be logged in dev mode if this outlet * is used in the application. */ readonly supportsBindingToComponentInputs?: true; } /** * @description * * Acts as a placeholder that Angular dynamically fills based on the current router state. * * Each outlet can have a unique name, determined by the optional `name` attribute. * The name cannot be set or changed dynamically. If not set, default value is "primary". * * ```html * <router-outlet></router-outlet> * <router-outlet name='left'></router-outlet> * <router-outlet name='right'></router-outlet> * ``` * * Named outlets can be the targets of secondary routes. * The `Route` object for a secondary route has an `outlet` property to identify the target outlet: * * `{path: <base-path>, component: <component>, outlet: <target_outlet_name>}` * * Using named outlets and secondary routes, you can target multiple outlets in * the same `RouterLink` directive. * * The router keeps track of separate branches in a navigation tree for each named outlet and * generates a representation of that tree in the URL. * The URL for a secondary route uses the following syntax to specify both the primary and secondary * routes at the same time: * * `http://base-path/primary-route-path(outlet-name:route-path)` * * A router outlet emits an activate event when a new component is instantiated, * deactivate event when a component is destroyed. * An attached event emits when the `RouteReuseStrategy` instructs the outlet to reattach the * subtree, and the detached event emits when the `RouteReuseStrategy` instructs the outlet to * detach the subtree. * * ```html * <router-outlet * (activate)='onActivate($event)' * (deactivate)='onDeactivate($event)' * (attach)='onAttach($event)' * (detach)='onDetach($event)'></router-outlet> * ``` * * @see {@link RouterLink} * @see {@link Route} * @see [Show routes with outlets](guide/routing/show-routes-with-outlets) * @ngModule RouterModule * * @publicApi */ declare class RouterOutlet implements OnDestroy, OnInit, RouterOutletContract { private activated; private _activatedRoute; /** * The name of the outlet * */ name: string; activateEvents: EventEmitter<any>; deactivateEvents: EventEmitter<any>; /** * Emits an attached component instance when the `RouteReuseStrategy` instructs to re-attach a * previously detached subtree. **/ attachEvents: EventEmitter<unknown>; /** * Emits a detached component instance when the `RouteReuseStrategy` instructs to detach the * subtree. */ detachEvents: EventEmitter<unknown>; /** * Data that will be provided to the child injector through the `ROUTER_OUTLET_DATA` token. * * When unset, the value of the token is `undefined` by default. */ readonly routerOutletData: i0.InputSignal<unknown>; private parentContexts; private location; private changeDetector; private inputBinder; /** @docs-private */ readonly supportsBindingToComponentInputs = true; /** @docs-private */ ngOnChanges(changes: SimpleChanges): void; /** @docs-private */ ngOnDestroy(): void; private isTrackedInParentContexts; /** @docs-private */ ngOnInit(): void; private initializeOutletWithName; get isActivated(): boolean; /** * @returns The currently activated component instance. * @throws An error if the outlet is not activated. */ get component(): Object; get activatedRoute(): ActivatedRoute; get activatedRouteData(): Data; /** * Called when the `RouteReuseStrategy` instructs to detach the subtree */ detach(): ComponentRef<any>; /** * Called when the `RouteReuseStrategy` instructs to re-attach a previously detached subtree */ attach(ref: ComponentRef<any>, activatedRoute: ActivatedRoute): void; deactivate(): void; activateWith(activatedRoute: ActivatedRoute, environmentInjector: EnvironmentInjector): void; static ɵfac: i0.ɵɵFactoryDeclaration<RouterOutlet, never>; static ɵdir: i0.ɵɵDirectiveDeclaration<RouterOutlet, "router-outlet", ["outlet"], { "name": { "alias": "name"; "required": false; }; "routerOutletData": { "alias": "routerOutletData"; "required": false; "isSignal": true; }; }, { "activateEvents": "activate"; "deactivateEvents": "deactivate"; "attachEvents": "attach"; "detachEvents": "detach"; }, never, never, true, never>; } /** * @description * * Options that modify the `Router` URL. * Supply an object containing any of these properties to a `Router` navigation function to * control how the target URL should be constructed. * * @see {@link Router#navigate} * @see {@link Router#createUrlTree} * @see [Routing and Navigation guide](guide/routing/common-router-tasks) * * @publicApi */ interface UrlCreationOptions { /** * Specifies a root URI to use for relative navigation. * * For example, consider the following route configuration where the parent route * has two children. * * ```ts * [{ * path: 'parent', * component: ParentComponent, * children: [{ * path: 'list', * component: ListComponent * },{ * path: 'child', * component: ChildComponent * }] * }] * ``` * * 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) {} * * go() { * router.navigate(['../list'], { relativeTo: this.route }); * } * } * ``` * * A value of `null` or `undefined` indicates that the navigation commands should be applied * relative to the root. */ relativeTo?: ActivatedRoute | null; /** * Sets query parameters to the URL. * * ```ts * // Navigate to /results?page=1 * router.navigate(['/results'], { queryParams: { page: 1 } }); * ``` */ queryParams?: Params | null; /** * Sets the hash fragment for the URL. * * ```ts * // Navigate to /results#top * router.navigate(['/results'], { fragment: 'top' }); * ``` */ fragment?: string; /** * How to handle query parameters in the router link for the next navigation. * One of: * * `preserve` : Preserve current parameters. * * `merge` : Merge new with current parameters. * * The "preserve" option discards any new query params: * ```ts * // from /view1?page=1 to/view2?page=1 * router.navigate(['/view2'], { queryParams: { page: 2 }, queryParamsHandling: "preserve" * }); * ``` * The "merge" option appends new query params to the params from the current URL: * ```ts * // from /view1?page=1 to/view2?page=1&otherKey=2 * router.navigate(['/view2'], { queryParams: { otherKey: 2 }, queryParamsHandling: "merge" * }); * ``` * In case of a key collision between current parameters and those in the `queryParams` object, * the new value is used. * */ queryParamsHandling?: QueryParamsHandling | null; /** * When true, preserves the URL fragment for the next navigation * * ```ts * // Preserve fragment from /results#top to /view#top * router.navigate(['/view'], { preserveFragment: true }); * ``` */ preserveFragment?: boolean; } /** * @description * * Options that modify the `Router` navigation strategy. * Supply an object containing any of these properties to a `Router` navigation function to * control how the target URL should be constructed or interpreted. * * @see {@link Router#navigate} * @see {@link Router#navigateByUrl} * @see {@link Router#createurltree} * @see [Routing and Navigation guide](guide/routing/common-router-tasks) * @see {@link UrlCreationOptions} * @see {@link NavigationBehaviorOptions} * * @publicApi */ interface NavigationExtras extends UrlCreationOptions, NavigationBehaviorOptions { } type RestoredState = { [k: string]: any; navigationId: number; ɵrouterPageId?: number; }; /** * Information about a navigation operation. * Retrieve the most recent navigation object with the * [Router.currentNavigation() method](api/router/Router#currentNavigation) . * * * *id* : The unique identifier of the current navigation. * * *initialUrl* : The target URL passed into the `Router#navigateByUrl()` call before navigation. * This is the value before the router has parsed or applied redirects to it. * * *extractedUrl* : The initial target URL after being parsed with `UrlSerializer.extract()`. * * *finalUrl* : The extracted URL after redirects have been applied. * This URL may not be available immediately, therefore this property can be `undefined`. * It is guaranteed to be set after the `RoutesRecognized` event fires. * * *trigger* : Identifies how this navigation was triggered. * -- 'imperative'--Triggered by `router.navigateByUrl` or `router.navigate`. * -- 'popstate'--Triggered by a popstate event. * -- 'hashchange'--Triggered by a hashchange event. * * *extras* : A `NavigationExtras` options object that controlled the strategy used for this * navigation. * * *previousNavigation* : The previously successful `Navigation` object. Only one previous * navigation is available, therefore this previous `Navigation` object has a `null` value for its * own `previousNavigation`. * * @publicApi */ interface Navigation { /** * The unique identifier of the current navigation. */ id: number; /** * The target URL passed into the `Router#navigateByUrl()` call before navigation. This is * the value before the router has parsed or applied redirects to it. */ initialUrl: UrlTree; /** * The initial target URL after being parsed with `UrlHandlingStrategy.extract()`. */ extractedUrl: UrlTree; /** * The extracted URL after redirects have been applied. * This URL may not be available immediately, therefore this property can be `undefined`. * It is guaranteed to be set after the `RoutesRecognized` event fires. */ finalUrl?: UrlTree; /** * Identifies how this navigation was triggered. */ trigger: NavigationTrigger; /** * Options that controlled the strategy used for this navigation. * See `NavigationExtras`. */ extras: NavigationExtras; /** * The previously successful `Navigation` object. Only one previous navigation * is available, therefore this previous `Navigation` object has a `null` value * for its own `previousNavigation`. */ previousNavigation: Navigation | null; /** * Aborts the navigation if it has not yet been completed or reached the point where routes are being activated. * This function is a no-op if the navigation is beyond the point where it can be aborted. */ readonly abort: () => void; } /** * @description * * Represents the detached route tree. * * This is an opaque value the router will give to a custom route reuse strategy * to store and retrieve later on. * * @publicApi */ type DetachedRouteHandle = {}; /** * @description * * Destroys the component associated with a `DetachedRouteHandle`. * * This function should be used when a `RouteReuseStrategy` decides to drop a stored handle * and wants to ensure that the component is destroyed. * * @param handle The detached route handle to destroy. * * @publicApi * @see [Manually destroying detached route handles](guide/routing/customizing-route-behavior#manually-destroying-detached-route-handles) */ declare function destroyDetachedRouteHandle(handle: DetachedRouteHandle): void; /** * @description * * Provides a way to customize when activated routes get reused. * * @publicApi */ declare abstract class RouteReuseStrategy { /** Determines if this route (and its subtree) should be detached to be reused later */ abstract shouldDetach(route: ActivatedRouteSnapshot): boolean; /** * Stores the detached route. * * Storing a `null` value should erase the previously stored value. */ abstract store(route: ActivatedRouteSnapshot, handle: DetachedRouteHandle | null): void; /** Determines if this route (and its subtree) should be reattached */ abstract shouldAttach(route: ActivatedRouteSnapshot): boolean; /** Retrieves the previously stored route */ abstract retrieve(route: ActivatedRouteSnapshot): DetachedRouteHandle | null; /** Determines if a route should be reused */ abstract shouldReuseRoute(future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot): boolean; static ɵfac: i0.ɵɵFactoryDeclaration<RouteReuseStrategy, never>; static ɵprov: i0.ɵɵInjectableDeclaration<RouteReuseStrategy>; } /** * @description * * This base route reuse strategy only reuses routes when the matched router configs are * identical. This prevents components from being destroyed and recreated * when just the route parameters, query parameters or fragment change * (that is, the existing component is _reused_). * * This strategy does not store any routes for later reuse. * * Angular uses this strategy by default. * * * It can be used as a base class for custom route reuse strategies, i.e. you can create your own * class that extends the `BaseRouteReuseStrategy` one. * @publicApi */ declare abstract class BaseRouteReuseStrategy implements RouteReuseStrategy { /** * Whether the given route should detach for later reuse. * Always returns false for `BaseRouteReuseStrategy`. * */ shouldDetach(route: ActivatedRouteSnapshot): boolean; /** * A no-op; the route is never stored since this strategy never detaches routes for later re-use. */ store(route: ActivatedRouteSnapshot, detachedTree: DetachedRouteHandle): void; /** Returns `false`, meaning the route (and its subtree) is never reattached */ shouldAttach(route: ActivatedRouteSnapshot): boolean; /** Returns `null` because this strategy does not store routes for later re-use. */ retrieve(route: ActivatedRouteSnapshot): DetachedRouteHandle | null; /** * Determines if a route should be reused. * This strategy returns `true` when the future route config and current route config are * identical. */ shouldReuseRoute(future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot): boolean; /** * Determines if the injector for the given route should be destroyed. * * This method is called by the router when the `RouteReuseStrategy` is destroyed. * If this method returns `true`, the router will destroy the injector for the given route. * * @see {@link withExperimentalAutoCleanupInjectors} * @xperimental 21.1 */ shouldDestroyInjector(route: Route): boolean; } /** * @description * * A service that facilitates navigation among views and URL manipulation capabilities. * This service is provided in the root scope and configured with [provideRouter](api/router/provideRouter). * * @see {@link Route} * @see {@link provideRouter} * @see [Routing and Navigation Guide](guide/routing/common-router-tasks). * * @ngModule RouterModule * * @publicApi */ declare class Router { private get currentUrlTree(); private get rawUrlTree(); private disposed; private nonRouterCurrentEntryChangeSubscription?; private readonly console; private readonly stateManager; private readonly options; private readonly pendingTasks; private readonly urlUpdateStrategy; private readonly navigationTransitions; private readonly urlSerializer; private readonly location; private readonly urlHandlingStrategy; private readonly injector; /** * The private `Subject` type for the public events exposed in the getter. This is used internally * to push events to. The separate field allows us to expose separate types in the public API * (i.e., an Observable rather than the Subject). */ private _events; /** * An event stream for routing events. */ get events(): Observable<Event>; /** * The current state of routing in this NgModule. */ get routerState(): RouterState; /** * True if at least one navigation event has occurred, * false otherwise. */ navigated: boolean; /** * A strategy for re-using routes. * * @deprecated Configure using `providers` instead: * `{provide: RouteReuseStrategy, useClass: MyStrategy}`. */ routeReuseStrategy: RouteReuseStrategy; /** * How to handle a navigation request to the current URL. * * * @deprecated Configure this through `provideRouter` or `RouterModule.forRoot` instead. * @see {@link withRouterConfig} * @see {@link provideRouter} * @see {@link RouterModule} */ onSameUrlNavigation: OnSameUrlNavigation; config: Routes; /** * Indicates whether the application has opted in to binding Router data to component inputs. * * This option is enabled by the `withComponentInputBinding` feature of `provideRouter` or * `bindToComponentInputs` in the `ExtraOptions` of `RouterModule.forRoot`. */ readonly componentInputBindingEnabled: boolean; /** * Signal of the current `Navigation` object when the router is navigating, and `null` when idle. * * Note: The current navigation becomes to null after the NavigationEnd event is emitted. */ readonly currentNavigation: Signal<Navigation | null>; constructor(); private eventsSubscription; private subscribeToNavigationEvents; /** * Sets up the location change listener and performs the initial navigation. */ initialNavigation(): void; /** * Sets up the location change listener. This listener detects navigations triggered from outside * the Router (the browser back/forward buttons, for example) and schedules a corresponding Router * navigation so that the correct events, guards, etc. are triggered. */ setUpLocationChangeListener(): void; /** * Schedules a router navigation to synchronize Router state with the browser state. * * This is done as a response to a popstate event and the initial navigation. These * two scenarios represent times when the browser URL/state has been updated and * the Router needs to respond to ensure its internal state matches. */ private navigateToSyncWithBrowser; /** The current URL. */ get url(): string; /** * Returns the current `Navigation` object when the router is navigating, * and `null` when idle. * * @deprecated 20.2 Use the `currentNavigation` signal instead. */ getCurrentNavigation(): Navigation | null; /** * The `Navigation` object of the most recent navigation to succeed and `null` if there * has not been a successful navigation yet. */ get lastSuccessfulNavigation(): Signal<Navigation | null>; /** * Resets the route configuration used for navigation and generating links. * * @param config The route array for the new configuration. * * @usageNotes * * ```ts * router.resetConfig([ * { path: 'team/:id', component: TeamCmp, children: [ * { path: 'simple', component: SimpleCmp }, * { path: 'user/:name', component: UserCmp } * ]} * ]); * ``` */ resetConfig(config: Routes): void; /** @docs-private */ ngOnDestroy(): void; /** Disposes of the router. */ dispose(): void; /** * Appends URL segments to the current URL tree to create a new URL tree. * * @param commands An array of URL fragments with which to construct the new URL tree. * If the path is static, can be the literal URL string. For a dynamic path, pass an array of path * segments, followed by the parameters for each segment. * The fragments are applied to the current URL tree or the one provided in the `relativeTo` * property of the options object, if supplied. * @param navigationExtras Options that control the navigation strategy. * @returns The new URL tree. * * @usageNotes * * ```ts * // create /team/33/user/11 * router.createUrlTree(['/team', 33, 'user', 11]); * * // create /team/33;expand=true/user/11 * router.createUrlTree(['/team', 33, {expand: true}, 'user', 11]); * * // you can collapse static segments like this (this works only with the first passed-in value): * router.createUrlTree(['/team/33/user', userId]); * * // If the first segment can contain slashes, and you do not want the router to split it, * // you can do the following: * router.createUrlTree([{segmentPath: '/one/two'}]); * * // create /team/33/(user/11//right:chat) * router.createUrlTree(['/team', 33, {outlets: {primary: 'user/11', right: 'chat'}}]); * * // remove the right secondary node * router.createUrlTree(['/team', 33, {outlets: {primary: 'user/11', right: null}}]); * * // assuming the current url is `/team/33/user/11` and the route points to `user/11` * * // navigate to /team/33/user/11/details * router.createUrlTree(['details'], {relativeTo: route}); * * // navigate to /team/33/user/22 * router.createUrlTree(['../22'], {relativeTo: route}); * * // navigate to /team/44/user/22 * router.createUrlTree(['../../team/44/user/22'], {relativeTo: route}); * ``` * Note that a value of `null` or `undefined` for `relativeTo` indicates that the * tree should be created relative to the root. * */ createUrlTree(commands: readonly any[], navigationExtras?: UrlCreationOptions): UrlTree; /** * Navigates to a view using an absolute route path. * * @param url An absolute path for a defined route. The function does not apply any delta to the * current URL. * @param extras An object containing properties that modify the navigation strategy. * * @returns A Promise that resolves to 'true' when navigation succeeds, * to 'false' when navigation fails, or is rejected on error. * * @usageNotes * * The following calls request navigation to an absolute path. * * ```ts * router.navigateByUrl("/team/33/user/11"); * * // Navigate without updating the URL * router.navigateByUrl("/team/33/user/11", { skipLocationChange: true }); * ``` * * @see [Routing and Navigation guide](guide/routing/common-router-tasks) * */ navigateByUrl(url: string | UrlTree, extras?: NavigationBehaviorOptions): Promise<boolean>; /** * Navigate based on the provided array of commands and a starting point. * If no starting route is provided, the navigation is absolute. * * @param commands An array of URL fragments with which to construct the target URL. * If the path is static, can be the literal URL string. For a dynamic path, pass an array of path * segments, followed by the parameters for each segment. * The fragments are applied to the current URL or the one provided in the `relativeTo` property * of the options object, if supplied. * @param extras An options object that determines how the URL should be constructed or * interpreted. * * @returns A Promise that resolves to `true` when navigation succeeds, or `false` when navigation * fails. The Promise is rejected when an error occurs if `resolveNavigationPromiseOnError` is * not `true`. * * @usageNotes * * 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 * router.navigate(['team', 33, 'user', 11], {relativeTo: route, skipLocationChange: true}); * ``` * * @see [Routing and Navigation guide](guide/routing/common-router-tasks) * */ navigate(commands: readonly any[], extras?: NavigationExtras): Promise<boolean>; /** Serializes a `UrlTree` into a string */ serializeUrl(url: UrlTree): string; /** Parses a string into a