To create a custom app screen that is rendered using a custom template:

//In functions.js:
App.addCustomRoute( 'my-custom-screen-fragment', 'my-custom-screen-template' ); 
//Note: no final .html for the template name here!

This creates a new screen in the app that can be reached at #my-custom-screen-fragment and is rendered using the my-custom-screen-template.html template.

Then to pass custom data (my_custom_data) to your custom template:

App.filter( 'template-args', function( template_args, view_type, view_template ) {
	if ( view_template === 'my-custom-template') { //Don't need .html here

		//Add our custom data:
		template_args.my_custom_data = { key: 'value' };

		//Now "my_custom_data" variable is available in the my-custom-template.html template :)
	return template_args;
} );

To go further:

Published by Mathieu on July 13, 2017

Freelance Senior Web Developer, WordPress since 2009, JS/Backbone since 2012, Custom Back-End devs, WebApps and Plugins for clients and the community.

Leave a Reply

Your email address will not be published. Required fields are marked *

Having questions?

FAQ | Tutorials | Documentation


Contact Us