Adding a new route to an existing app, need help

I have an existing Ember app which works great. I need to add a new subroute to the app to allow users to view additional information. My current route looks like this:

Social.Router.map(function() {
    this.resource('accounts',  { path: '/accounts' }, function(){
        this.resource('account', { path: ':account_id'});
    });
});

with the following URL

#/accounts/56/

The route I’d like to add is this:

#/accounts/56/interactions

So I added a nested route like so:

Social.Router.map(function() {
    this.resource('accounts',  { path: '/accounts' }, function(){
        this.resource('account', { path: ':account_id'}, function(){
            this.route('interactions', { path: '/interactions'});
        });
    });
});

But when that route is accessed I get the following error:

Uncaught Error: assertion failed: The route interactions was not found core.libs.js:2236
Uncaught Error: You cannot modify child views while in the inBuffer state core.libs.js:19298

So I also added an empty InteractionsRoute but that didn’t resolve it:

Social.InteractionsRoute = Ember.Route.extend();

Does anyone have input on what might be going wrong?

1 Like

In addition I’m trying to add a button to the interface which looks like this:

{{#linkTo "interactions"}}@ Interactions{{/linkTo}}

I think this maybe

{{#linkTo account.interactions this}}Interactions{{/linkTo}}

Note that, this is the model of controller

You have two possibilities, either like @pudgeon suggest, the route is account.interactions, either in the router, you have to change from

this.route('interactions') to this.resource('interactions'). That’s a difference between route and resource.