Skip to content

docs(router): document catch-all routes for not found pages - #4797

Merged
ShaneK merged 2 commits into
feature-9.1from
FW-6969
Oct 23, 2026
Merged

ShaneK merged 2 commits into
feature-9.1from
FW-6969

Conversation

@ShaneK

@ShaneK ShaneK commented Oct 20, 2026

Copy link
Copy Markdown
Member

In Ionic Framework 9.1 we're adding support for catch-all routes in ion-router, this docs change adds relevant verbiage to help users know about this functionality when it's released.

@ShaneK
ShaneK requested a review from a team as a code owner October 20, 2026 19:28
@ShaneK
ShaneK requested review from thetaPC and removed request for a team October 20, 2026 19:28
@vercel

vercel Bot commented Oct 20, 2026 •

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
ionic-docs Ready Ready Preview Oct 23, 2026 5:10pm UTC

Request Review

@brandyscarney brandyscarney left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good! I added a few optional suggestions.

Comment thread docs/api/route.mdx

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It doesn't need to be done now but we should consider adding a Navigation/Routing guide under JavaScript like the other frameworks have:

I think that would be a better place for this kind of information.

Comment thread docs/api/route.mdx Outdated
Comment thread docs/api/route.mdx Outdated
Comment thread docs/api/route.mdx Outdated

@thetaPC thetaPC left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@ShaneK
ShaneK merged commit 597983f into feature-9.1 Oct 23, 2026
7 checks passed
@ShaneK
ShaneK deleted the FW-6969 branch October 23, 2026 17:20
ShaneK added a commit to ionic-team/ionic-framework that referenced this pull request Oct 23, 2026
Issue number: resolves #24726

---------

## What is the current behavior?

Currently, `ion-router` can't match an unknown path, so there's no way
to render a "not found" page. A `*` in an `ion-route` url is matched
literally, `url="/:any"` only catches a single segment, and an unknown
path below a known route (e.g., `/admin/settings`) renders that route.

## What is the new behavior?

An `ion-route` url that ends in `*` now matches any remaining path, and
the matched part is passed to the component as `pathMatch`. Ranking
follows React Router, so a catch-all only beats a route that matches the
whole path when it has more fixed segments (`/admin/*` beats
`/:section/:id` but not `/admin/:id`). It always beats a route that only
matches by ignoring trailing segments. Apps without a `*` route match
exactly as before.

## Does this introduce a breaking change?

- [ ] Yes
- [X] No

Not a breaking change, but a new feature, which is why it's in a feature
branch.

## Other information

This only affects vanilla JS and Stencil apps, since Angular, React and
Vue use their own routers. The `*` in `ion-route-redirect` is unchanged,
so `from="/admin/*"` still doesn't match `/admin` while `url="/admin/*"`
does. The docs call out that difference (after [the docs
PR](ionic-team/ionic-docs#4797) is merged).

[Catch-all test
page](https://ionic-framework-git-fw-6969-ionic1.vercel.app/src/components/router/test/catch-all?ionic:mode=ios#/docs/a/b)

## Latest dev build
```
9.0.7-dev.11792524803.14f0e7d2
```

This branch was successfully deployed

1 active deployment
Preview — 1d2d8f73 Deployed Oct 23, 2026 by vercel[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants