Passing custom data into a template?



  • So to get data into a page there are obviously two methods, server side (pass into template then compile) or client side (ajax). I am very familiar with express, but I don't see a possible way of passing additional data to a template after res.render has been called, I am saying this because I know the home page is already being rendered somewhere in the core, so there is no way for me to inject data before it gets called is there?

    If not do I need to replicate all the json being passed in to the default render, add my custom data, then call res.render myself?

    Or is the only method rendering the data via ajax call, which would be my least preferable method.

    I know things like this have been documented but it is not very clear to me how to pass in custom data to a template. My case for this is to pass in categories to a sub-header inside header.tpl here is what I have so far.

    (function(module) {
    	"use strict";
    
    	var theme = {};
    	var catLength = [1,2,3,4,5,6,7];
    	var Categories = module.parent.require("./Categories");
    
    	theme.init = function(params, callback) {
    		var app = params.router;
    	    var hostMiddleware = params.middleware;
    		var hostControllers = params.controllers;
    		var categories = {};
    
    		Categories.getCategoriesData(catLength, function(err, data) {
    			categories = data;
    		});
            
            // TODO: make this a more nodebb like route
    		// app.get('/api', function(req,res) {
    		// 	res.render('/', {test:true});
    		// });
    
    		callback();
    	};
    
    	module.exports = theme;
    
    }(module));
    

    Also I looked through ./Categories and getCategoriesData() seemed like the only method to get categories, my question is why do I have to pass an array of how many categories I want, thats not fun. Why isn't there a method to get all without specifying anything?

    Thanks guys!


  • Admin

    You can do what you want with the filter:middleware.renderHeader hook.

    In your plugin add the data you want into it like so

    myPlugin.onRenderHeader(data, callback) {
        Categories.getAllCategories(data.req.uid, function(err, categories){
             if (err) {
                  return callback(err);
             }
             data.templateValues.categories = categories;
             callback(null, data);
        });
    };
    

    Now in your header.tpl you can access the categories it will be in an array called categories, To print out their names.

    <!-- BEGIN categories -->
    <p>{categories.name}</p>
    <!-- END categories -->
    


  • @baris

    WOW thanks man.

    One thing though myPlugin.onRenderHeader = function() {}

    This works, thanks! So I am guessing callback() is where the data is sent to the core then that adds it before rendering?

    Great job!


  • Admin

    Yes, the hook is fired right before the header is rendered here. You add the categories into the templateValues which is then passed to app.render and rendered.


Log in to reply
 


Looks like your connection to NodeBB was lost, please wait while we try to reconnect.