UrlMatcher
Router uses UrlMatcher
to decide that Route.path
from configuration is fit to a current navigation URL. Router splits url
to segments and calls UrlMatcher
function.
type UrlMatcher = (segments: UrlSegment[], group: UrlSegmentGroup, route: Route) => UrlMatchResult;
A custom URL matcher can be provided when a combination of path
and pathMatch
isn't expressive enough.
For instance, the following matcher matches html files.
export function htmlFiles(url: UrlSegment[]) {
return url.length === 1 && url[0].path.endsWith('.html') ? ({consumed: url}) : null;
}
export const routes = [{ matcher: htmlFiles, component: AnyComponent }];
defaultUrlMatcher
If Route.urlMatcher
is not defined, will be used defaultUrlMatcher
.
defaultUrlMatcher
splits path
to segments usign delimeter /
. If segment starts from :
it marks as parameter with the same name (except :
at beginning).
Path | URL |
---|---|
blog |
/blog |
blog/post |
/blog/post |
blog/post/:id |
/blog/post/123 |
Links & Tutorials