Sending partials from keystone.js for use with ui.view - angular-ui-router

Question

Been trying to get my head around this, but can't for the life of me figure out what I'm missing.
So I want to set up keystone, but want to use angular on the front end, and I want to avoid reloading the page every time.
Got angular running quite fine and pretty quickly. But now I am trying to set up the routes on the backend for the partials, and while I can manage to get them set up to answer, I can not get them to just send the partial, whatever I do it sends the whole page back to me. with html, body, head.
So far I have managed to figure out that I need a route, so imported my uiview directory and added the following route:
var keystone = require('keystone');
var middleware = require('./middleware');
var importRoutes = keystone.importer(__dirname);
// Common Middleware
keystone.pre('routes', middleware.initLocals);
keystone.pre('render', middleware.flashMessages);
// Import Route Controllers
var routes = {
views: importRoutes('./views'),
uiviews: importRoutes('/uiviews'),
};
// Setup Route Bindings
exports = module.exports = function (app) {
// Views
app.get('/', routes.views.index);
app.get('/uiviews/index',routes.uiviews.index);
app.get('/blog/:category?', routes.views.blog);
app.get('/blog/post/:post', routes.views.post);
app.get('/gallery', routes.views.gallery);
app.all('/contact', routes.views.contact);
// NOTE: To protect a route so that only admins can see it, use the requireUser middleware:
// app.get('/protected', middleware.requireUser, routes.views.protected);
};
I think what is happening is that the pre compiler ( keystone.pre('routes', middleware.initLocals);) gets hold of it and wraps it all the way it thinks it is suppose to, but I'm not certain.
I even tried to create a uiviews.js in ./routes with just my uiroute, but that gives me 404 errors
var keystone = require('keystone');
var middleware = require('./middleware');
var importRoutes = keystone.importer(__dirname);
// Import Route Controllers
var routes = {
uiviews: importRoutes('/uiviews'),
};
// Setup Route Bindings
exports = module.exports = function (app) {
// Views
console.log('uiroutes added');
app.get('/uiview/index',routes.uiviews.index);
// NOTE: To protect a route so that only admins can see it, use the requireUser middleware:
// app.get('/protected', middleware.requireUser, routes.views.protected);
};
Any ideas?

Answer 1

This is more of a Express question and not of keystone.Js.
You have not said which router you want partially. and neither shared rendering code of that handler.
Any way Make sure that the template you are using does not include any other template. particularly default.jade

Answer 2

I finally managed to figure out what I was missing.
Technically it is not keystone.js that controls what is sent, it is handlebars. This might be obvious to everyone but me.
However, the trick is to tell handlebars not to include the layout, which is done using {layout: false}. So my uiview route looks like this (last little line does the magic):
var keystone = require('keystone');
exports = module.exports = function(req, res) {
console.log("request for index received");
var view = new keystone.View(req, res),
locals = res.locals;
console.log(locals);
// Render the view
console.log(view)
view.render('uiviews/index', {layout: false});
};
with the index.js router looking like this:
var keystone = require('keystone');
var middleware = require('./middleware');
var importRoutes = keystone.importer(__dirname);
// Common Middleware
keystone.pre('routes', middleware.initLocals);
keystone.pre('render', middleware.flashMessages);
// Import Route Controllers
var routes = {
views: importRoutes('./views'),
uiviews: importRoutes('/uiviews'),
};
// Setup Route Bindings
exports = module.exports = function (app) {
// Views
console.log('index added');
app.get('/', routes.views.index);
app.get('/partners', routes.views.partners);
app.get('/blog/:category?', routes.views.blog);
app.get('/blog/post/:post', routes.views.post);
app.get('/gallery', routes.views.gallery);
app.get('/philosophy', routes.views.philosophy)
app.get('/socialmedia', routes.views.socialmedia)
app.all('/contact', routes.views.contact);
app.get('/uiviews/index', routes.uiviews.index)
// NOTE: To protect a route so that only admins can see it, use the requireUser middleware:
// app.get('/protected', middleware.requireUser, routes.views.protected);
};
And now you can call [host]/uiviews/index and only receive a partial route.