# Having lots of trouble with routes and a navigator

**URL:** <https://discuss.emberjs.com/t/having-lots-of-trouble-with-routes-and-a-navigator/4391>\
**Category:** Uncategorized\
**Created:** [March 5, 2014, 3:26pm UTC](https://discuss.emberjs.com/t/having-lots-of-trouble-with-routes-and-a-navigator/4391 "2014-03-05T15:26:06Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![rodryquintero](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/rodryquintero/32/15551_2.png) [@rodryquintero](https://discuss.emberjs.com/u/rodryquintero)\
**Post date:** [March 5, 2014, 3:26pm UTC](https://discuss.emberjs.com/t/having-lots-of-trouble-with-routes-and-a-navigator/4391/1 "2014-03-05T15:26:06Z")

</div>

I have an app that, for server configuration purposes that cannot be changed, has to reside in [http://localhost/csp/acb/citas/](http://localhost/csp/acb/citas/). Therefore, I created the following app.

```
App.Router.map(function() {
    this.route("index", { path: "" });  
    this.route("main", {path: "main"});  
});

App.Router.reopen({
  rootURL: '/csp/acb/citas/'
});

var items = [
	{item: "Main", url:"main"	},
	{item: "Work", url: "work"	},
	{item: "Conf", url: "conf"	}
];

App.ApplicationController = Ember.Controller.extend({
	items: items
});

```

And the following template (by the way, this is a component).

```
<script type="text/x-handlebars" id="components/bs-header">
  <div class="navbar-header">
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
      <span class="sr-only">Toggle navigation</span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
    </button>
    <a class="navbar-brand" href="#">Bootstrap theme</a>
  </div>
  <div class="navbar-collapse collapse">
    <ul class="nav navbar-nav">
    {{#each items}}
    {{log item}}
      <li>{{#link-to url item}}{{item}}{{/link-to}}</li>
    {{/each}}
    </ul>
  </div><!--/.nav-collapse -->
</script>

```

When I run the app, i get the following error.

> Uncaught Error: More context objects were passed than there are dynamic segments for the route: main

When I include the /csp/acb/citas/ to the route and url of the template, i get the following.

> Uncaught Error: Assertion Failed: The attempt to link-to route ‘/csp/acb/citas/main’ failed (also tried ‘/csp/acb/citas/main.index’). The router did not find ‘/csp/acb/citas/main’ in its possible routes: ‘loading’, ‘error’, ‘index’, ‘main’

This is really frustating since I thought this would be a simple task to perform. Please help.

---

<div class="post-metadata">

**Author:** ![rodryquintero](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/rodryquintero/32/15551_2.png) [@rodryquintero](https://discuss.emberjs.com/u/rodryquintero)\
**Post date:** [March 5, 2014, 4:58pm UTC](https://discuss.emberjs.com/t/having-lots-of-trouble-with-routes-and-a-navigator/4391/2 "2014-03-05T16:58:24Z")

</div>

Hello ember community. Due to time constraints, and a steeper learning curve for Ember, I will have to put on hold my ember project and go back to continue developing it using Backbone.

My previous post about [components](http://discuss.emberjs.com/t/how-to-use-stand-alone-templates-with-components/4374) had a workaround that I could live with. But the problem I experienced about routes, explained in this thread, was a deal breaker for me. The router in Ember is very different from the one implemented in Backbone and I was simply not able to understand it and implemente what I intended.

As soon as I get help with this issue I intend to continue with my Ember efforts. Until then…

---

<div class="post-metadata">

**Author:** ![kgautreaux](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/kgautreaux/32/5162_2.png) [@kgautreaux](https://discuss.emberjs.com/u/kgautreaux)\
**Post date:** [March 6, 2014, 4:17am UTC](https://discuss.emberjs.com/t/having-lots-of-trouble-with-routes-and-a-navigator/4391/3 "2014-03-06T04:17:40Z")

</div>

I think your first error is probably due to the fact that the route requires a slash in the path argument.

`this.route("main", {path: "main"});` should be `this.route("main", {path: "/main"});` or even just `this.route("main");` should work by default.

You also shouldn’t need to explicitly put the index route in your router. That might save some confusion. The second error might be resolved by fixing the first but if not a JSbin or gist where you reproduce your error would be helpful to try to debug your issue.

---

<div class="post-metadata">

**Author:** ![rodryquintero](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/rodryquintero/32/15551_2.png) [@rodryquintero](https://discuss.emberjs.com/u/rodryquintero)\
**Post date:** [March 6, 2014, 5:44am UTC](https://discuss.emberjs.com/t/having-lots-of-trouble-with-routes-and-a-navigator/4391/4 "2014-03-06T05:44:26Z")

</div>

I tried your suggestion it did not work. I would put the code in JSBIN but I am not sure how it would work since I think the problem I have is becuase of the fact that the app is on a non-root path on the server.

Thanks for the reply.

---

<div class="post-metadata">

**Author:** ![kgautreaux](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/kgautreaux/32/5162_2.png) [@kgautreaux](https://discuss.emberjs.com/u/kgautreaux)\
**Post date:** [March 11, 2014, 7:08am UTC](https://discuss.emberjs.com/t/having-lots-of-trouble-with-routes-and-a-navigator/4391/6 "2014-03-11T07:08:36Z")

</div>

I don’t know if this will be helpful but I tried to build a component like your `bs-header` component. It is important to remember that components don’t inherit any scope from the route so you have to pass everything in that you want to display or iterate over.

You can see my attempt [here](http://emberjs.jsbin.com/dugigova/1).

It doesn’t solve your `rootURL` issue but as you say that is very hard to test without access to that particular environment.