CODEWITHSUNDEEP
layoutejssails.js
anhnt
anhnt

Reputation: 779

How to use multiple layout within a SailsJS app?

My Sails.js application have separate frontend and admin layout. My view engine is ejs.

How do I use separate layouts for frontend and admin site?

Can I use specific layout for each action?

Upvotes: 8

Views: 7478

Answers (5)

WikeC
WikeC

Reputation: 141

In Sails v0.12, if you need to set layout in your controller, you might create a new folder (e.g. "layout") and push layout files.

res.view('auth/login', {layout: layout/my_file_layout}

you can also do:

res.locals.layout = "layout/my_file_layout";
res.view('auth/login');

Upvotes: 2

Liko
Liko

Reputation: 2300

If you need to set view AND layout in your controller (Sails v0.11):

res.view('auth/login', { layout: null } );

Layout:

null = None

'folder/layout' = Your Layout

Upvotes: 0

cybercow
cybercow

Reputation: 437

Sorry for spamming your question but i need a similar solution for my app. It would be wonderful to define layouts in routes.js so for example /admin/* would use one layout, and eg. /app/* would use the other, etc. Because it's a pita do dive into controllers and overspam them with static layout paths. I tried this concept but it seems to be working only if I also define a controller in the routes.js config file eg:

module.exports.routes = {

   '/admin/*' : {
      controller: 'AdminController',
      action: 'index',
      locals: {
         layout: 'admin/layout'
      }
   }
};

This does work, but is routing all actions for admin into the same controller, which is of course wrong. If I omit the controller part, that concept is always using the default view/layout.ejs and the local is not set:

module.exports.routes = {

   '/admin/*' : {
      locals: {
         layout: 'admin/layout'
      }
   }
};

This doesn't work but it would be ideal to get it that way.

Upvotes: 1

Melvin
Melvin

Reputation: 6008

In Sails 0.10 you can set a different layout like this in your controller:

// override the layout to use another
    res.locals.layout = 'layouts/layout2';
    return res.view('test');

Detailed explanation here.

Upvotes: 3

bredikhin
bredikhin

Reputation: 9025

From Sails.js Documentation:

At least in EJS, instead of indicating your custom layout with the layout local, you must use _layoutFile:

res.view({
  _layoutFile: 'relativePathToYourCustomLayoutFromTheTargetView.ejs'
});

The path to the layout you're wanting to use should be specified relative to the view you're rendering. So if you're in the create action of the UserController, rendering a view (views/user/create.ejs), the relative path to your custom layout might be: ../staticSiteLayout.ejs

PROJECT FOLDER
└── views
    ├── staticSiteLayout.ejs
    ├── layout.ejs
    └── user
        └── create.ejs

UPDATE:

Seems like the documentation is a bit off from the code, so for the current (v0.9.8) version the way to go is the following:

module.exports = { 
  index: function(req, res){
    res.view({ layout: 'layoutadmin' });
  }
}

Upvotes: 3

Related Questions