# Configuring href for routes with parameters

**URL:** <https://discourse.aurelia.io/t/configuring-href-for-routes-with-parameters/4646>\
**Category:** Help Requests\
**Created:** [February 19, 2022, 11:15pm UTC](https://discourse.aurelia.io/t/configuring-href-for-routes-with-parameters/4646 "2022-02-19T23:15:28Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![manks](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/manks/32/1995_2.png) [@manks](https://discourse.aurelia.io/u/manks)\
**Post date:** [February 19, 2022, 11:15pm UTC](https://discourse.aurelia.io/t/configuring-href-for-routes-with-parameters/4646/1 "2022-02-19T23:15:28Z")

</div>

The documentation is a little slim on the expected format for `href`, especially when using route path parameters. The only example I see in the docs is `href: '#blah'`, which isn’t helpful at all.

I have a similar issue to the issue defined [here](https://discourse.aurelia.io/t/href-for-route-with-multiple-parameters/3514).

Ultimately, I need direct linking to routes in some cases, and there are multiple segments of the route that are parameters. Think of permalinks.

Like such: `http://localhost:4000/u/someuser/p/post-title`

This should correspond to routes defined as: `u/:username/p/:slug`

Here is how I actually define the routes:

File `app.ts`:

```javascript

  configureRouter(config: RouterConfiguration, router: Router) {
    config.options.pushState = true;
    config.options.root = '/';
    config.map([
      { route: ['u/:username'], name: 'user', moduleId: PLATFORM.moduleName('./user/index'), nav: false, title: 'User Profile'},
    ]);
    

```

File: `user/index.ts`:

```javascript

  configureRouter(config: RouterConfiguration, router: Router) {

    this.router = router;

    config.map([
      { route: [''], name: 'profile', moduleId: PLATFORM.moduleName('./profile.component'), nav: false, title: 'Profile'},
      { route: ['p/:slug'], name: 'post', moduleId: PLATFORM.moduleName('./post.component'), nav: true, title: 'Post'}
    ]);

  }

```

This, of course, yields the following error:

```auto
ERROR [app-router] Error: Invalid route config for "p/:slug" : dynamic routes must specify an "href:" to be included in the navigation model.

```

Setting `nav: false` (which makes sense, since they aren’t nav menu routes) on both routes still fails to load the route:

```auto
ERROR [app-router] Error: Route not found: 
error @ aurelia-logging-console.js?dc89:45
eval @ aurelia-logging.js?30fd:38
processResult @ aurelia-router.js?e32b:2205
eval @ aurelia-router.js?e32b:2165
Promise.then (async)
eval @ aurelia-router.js?e32b:2165
Promise.then (async)
AppRouter._dequeueInstruction @ aurelia-router.js?e32b:2114
eval @ aurelia-router.js?e32b:2107
AppRouter._queueInstruction @ aurelia-router.js?e32b:2104
eval @ aurelia-router.js?e32b:2021
Promise.then (async)
AppRouter.loadUrl @ aurelia-router.js?e32b:2021
BrowserHistory._loadUrl @ aurelia-history-browser.js?d627:262
BrowserHistory.navigate @ aurelia-history-browser.js?d627:201
DefaultLinkHandler._this.handler @ aurelia-history-browser.js?d627:48

```

Two questions

1. First, how would an `href` be defined for routes with parameters in order to get past this error?

2. Second, why didn’t this error occur for the parent route `u/:username`?

---

<div class="post-metadata">

**Author:** ![manks](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/manks/32/1995_2.png) [@manks](https://discourse.aurelia.io/u/manks)\
**Post date:** [February 20, 2022, 5:42am UTC](https://discourse.aurelia.io/t/configuring-href-for-routes-with-parameters/4646/2 "2022-02-20T05:42:57Z")

</div>

I think I might have found my problem. I had a `configureRouter()` method defined on my component. Removing it resolved my initial route not found error.

```javascript
    configureRouter(config: RouterConfiguration, router: Router) {
        this.router = router;
    }

```

---

<div class="post-metadata">

**Author:** ![manks](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/manks/32/1995_2.png) [@manks](https://discourse.aurelia.io/u/manks)\
**Post date:** [February 20, 2022, 7:25pm UTC](https://discourse.aurelia.io/t/configuring-href-for-routes-with-parameters/4646/3 "2022-02-20T19:25:49Z")

</div>

I’ve been thinking. Why does the presence of `configureRouter` change the routing behavior if the `RouterConfiguration` hasn’t been appended with additional child route. I would think that the route would just end at that point.

---

<div class="post-metadata">

**Author:** ![elitastic](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/elitastic/32/1787_2.png) [@elitastic](https://discourse.aurelia.io/u/elitastic)\
**Post date:** [February 21, 2022, 7:27am UTC](https://discourse.aurelia.io/t/configuring-href-for-routes-with-parameters/4646/4 "2022-02-21T07:27:42Z")

</div>

`configureRouter()` defines a child router (by convention). Every child router expects a default/fallback route plus a viewport!