Refactor router recognition and redirects#5352
Conversation
|
I think you have a mistype - by default should be selected route Can you make it so that if component is not defined it doesn't add anything to { path: '/posts' useAsDefault: true}
|
|
To explain. I have |
161eeeb to
922f2d4
Compare
|
I think "routes with an empty component" is a separate (but reasonable) concern. Right now you can easily construct a component with blank template and reference it where you need. @tandu could you file an issue describing this? |
|
Great! Thanks for the write-up, @tandu. |
922f2d4 to
158152e
Compare
|
@btford Would it be possible to have a version in which I could programmatically decide what to do when the child route is left off? In our app, we have a tabbed interface that I want to correspond to child routes. However, the contents of the tabs depend on the data I've loaded with these possibilities: I would like to have a child route for the selected tab to be able to specify via URL which tab is selected, but I also want the first tab to be selected by default if none is specified in the URL. In all the examples I've seen, I need to declare in code which one is to be used as default, but in my case any of three different tabs could be the one to use depending on the data. Is this problem solvable through AsyncRoutes combined with Child Routes somehow? |
a13a677 to
1467f2e
Compare
This is a big change. @matsko also deserves much of the credit for the implementation. Previously, `ComponentInstruction`s held all the state for async components. Now, we introduce several subclasses for `Instruction` to describe each type of navigation. BREAKING CHANGE: Redirects now use the Link DSL syntax. Before: ``` @RouteConfig([ { path: '/foo', redirectTo: '/bar' }, { path: '/bar', component: BarCmp } ]) ``` After: ``` @RouteConfig([ { path: '/foo', redirectTo: ['Bar'] }, { path: '/bar', component: BarCmp, name: 'Bar' } ]) ``` BREAKING CHANGE: This also introduces `useAsDefault` in the RouteConfig, which makes cases like lazy-loading and encapsulating large routes with sub-routes easier. Previously, you could use `redirectTo` like this to expand a URL like `/tab` to `/tab/posts`: @RouteConfig([ { path: '/tab', redirectTo: '/tab/users' } { path: '/tab', component: TabsCmp, name: 'Tab' } ]) AppCmp { ... } Now the recommended way to handle this is case is to use `useAsDefault` like so: ``` @RouteConfig([ { path: '/tab', component: TabsCmp, name: 'Tab' } ]) AppCmp { ... } @RouteConfig([ { path: '/posts', component: PostsCmp, useAsDefault: true, name: 'Posts' }, { path: '/users', component: UsersCmp, name: 'Users' } ]) TabsCmp { ... } ``` In the above example, you can write just `['/Tab']` and the route `Users` is automatically selected as a child route. Closes angular#4170 Closes angular#4490 Closes angular#4694 Closes angular#5200
1467f2e to
ab8645c
Compare
|
@matsko LGTM'd this |
|
Merging PR #5352 on behalf of @alxhub to branch presubmit-alxhub-pr-5352. |
|
This issue has been automatically locked due to inactivity. Read more about our automatic conversation locking policy. This action has been performed automatically by a bot. |
This has a little bit more cleanup work, but I'd like @matsko to start reviewing the code ASAP so we can finally land this. 🐈
This is a big change. @matsko also deserves much of the credit for the implementation.
Previously,
ComponentInstructions held all the state for async components.Now, we introduce several subclasses for
Instructionto describe each type of navigation.BREAKING CHANGE:
Redirects now use the Link DSL syntax. Before:
After:
BREAKING CHANGE:
This also introduces
useAsDefaultin the RouteConfig, which makes cases like lazy-loadingand encapsulating large routes with sub-routes easier.
Previously, you could use
redirectTolike this to expand a URL like/tabto/tab/posts:@RouteConfig([
{ path: '/tab', redirectTo: '/tab/users' }
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
Now the recommended way to handle this is case is to use
useAsDefaultlike so:In the above example, you can write just
['/Tab']and the routePostsis automatically selected as a child route.Closes #4170
Closes #4490
Closes #4694
Closes #5200