Menu
In app.ts I am looking to navigate to home/contract-view/10 on a action. Tried
this.router.navigateToRoute(`home/contract-view`, { id: 10}, { absolute: true });
fails with Route home/contract-view not be found
Another try:
this.router.navigate(`#/home/contract-view`, { id: 10});
fails with Route not found: contract-view(…)
How to achieve this?
App.ts:
configureRouter(config: RouterConfiguration, router: Router) {
config.title = 'Contracts Portal';
config.map([
{ route: ['', 'dummy'], name: 'dummy', moduleId: 'dummy', nav: false, title: 'Dummy', settings: { pos: 'left' } },
{ route: 'home', name: 'home', moduleId: 'home', nav: true, title: 'Home', settings:{pos: 'left', class: 'home' }, auth: true },
]);
this.router = router;
}
Home.ts:
configureRouter(config: RouterConfiguration, router: Router) {
config.map([
{ route: ['', 'contract-view/:id'], name: 'contract-view', moduleId: 'contract-view', nav: true, title: 'Contract' },
{ route: 'doc-view/:id', name: 'doc-view', href:'doc-view', moduleId: 'doc-view', nav: true, title: 'Document' },
]);
this.router = router;
this.router.refreshNavigation();
}
250
To use Aurelia's router, your component view must have a <router-view></router-view> element. In order to configure the router, the component's view-model requires a configureRouter () function. config.map () adds route (s) to the router.
The details link contains a lot of concepts. route-href is binding the anchor to Aurelia’s router. route: contactdetail is telling the router which route to load. params.bind: {id:contact.id} is telling the link to pass the contact’s ID to through the router to the view model that is being loaded.
Aurelia allows you to map any unknown routes. Parameters passed to mapUnknownRoutes () can be: A string to a moduleId. This module will be navigated to any time a route is not found. A routeConfig object. This configuration object will be used any time a route is not found.
By default Aurelia's routes are not case sensitive. Aurelia allows you to map any unknown routes. Parameters passed to mapUnknownRoutes () can be: A string to a moduleId. This module will be navigated to any time a route is not found. A routeConfig object. This configuration object will be used any time a route is not found.
preferred solution would be to use your named routes that you have configured in the router.
this.router.navigateToRoute('contract-view', {id: 10});
You have router in 'home' configured with contract-view/:id, so you need this.router.navigate('home/contract-view/10'). And try to remove this.router.refreshNavigation() too
29
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
