Can I switch the application.hbs OR set some sort of layout inheritance?

1

Hi, I am having a heck of a time trying to find a solution to this problem. I am building an app, in which you have a login page and then after logging in, you have access to the app’s pages/views

I would like to have a template that only shows for the login page. this template will not have menu items or anything else but the login form.

Then I would like all the other pages to have a template that holds a menu and other items (not to mention the page’s content).

My challenge is how do I go about templating this without having to tell all the apps pages to use the same layout.

Ideally, it would be great if I could set a default layout template and every page uses that BUT overwrite that for the login page.

How would you all suggest I handle this. And is there any examples?

2

You could put your main app under one resource and login under a different one:

App.Router.map(function(){
    this.resource('login');
    this.resource('main', {path: '/'}, function(){
        // the rest of your application's routes
    })
})

Then your logged in application layout goes in the main template and doesn’t affect the login templates.

Your application template would then just be {{outlet}}.

4 Likes
3

Thanks, This is exactly what I was looking for!

4

Here’s another solution to the general problem of needing a handful of routes to use a different layout, offered by AlexSpeller:

3 Likes