Cookies concent notice

This site uses cookies from Google to deliver its services and to analyze traffic.
Learn more
Skip to main content
This site is no longer updated.Head to Angular.devHome
/

This is the archived documentation for Angular v17. Please visit angular.dev to see this page for the current version of Angular.

createUrlTreeFromSnapshot

Creates a UrlTree relative to an ActivatedRouteSnapshot.

      
      createUrlTreeFromSnapshot(relativeTo: ActivatedRouteSnapshot, commands: any[], queryParams: Params = null, fragment: string = null): UrlTree
    
Parameters
relativeTo ActivatedRouteSnapshot

The ActivatedRouteSnapshot to apply the commands to

commands any[]

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 one provided in the relativeTo parameter.

queryParams Params

The query parameters for the UrlTree. null if the UrlTree does not have any query parameters.

Optional. Default is null.

fragment string

The fragment for the UrlTree. null if the UrlTree does not have a fragment.

Optional. Default is null.

Returns

UrlTree

Usage notes

      
      // create /team/33/user/11
createUrlTreeFromSnapshot(snapshot, ['/team', 33, 'user', 11]);

// create /team/33;expand=true/user/11
createUrlTreeFromSnapshot(snapshot, ['/team', 33, {expand: true}, 'user', 11]);

// you can collapse static segments like this (this works only with the first passed-in value):
createUrlTreeFromSnapshot(snapshot, ['/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:
createUrlTreeFromSnapshot(snapshot, [{segmentPath: '/one/two'}]);

// create /team/33/(user/11//right:chat)
createUrlTreeFromSnapshot(snapshot, ['/team', 33, {outlets: {primary: 'user/11', right:
'chat'}}], null, null);

// remove the right secondary node
createUrlTreeFromSnapshot(snapshot, ['/team', 33, {outlets: {primary: 'user/11', right: null}}]);

// For the examples below, assume the current URL is for the `/team/33/user/11` and the
`ActivatedRouteSnapshot` points to `user/11`:

// navigate to /team/33/user/11/details
createUrlTreeFromSnapshot(snapshot, ['details']);

// navigate to /team/33/user/22
createUrlTreeFromSnapshot(snapshot, ['../22']);

// navigate to /team/44/user/22
createUrlTreeFromSnapshot(snapshot, ['../../team/44/user/22']);