Custom Template Engine and Template Source for Knockout.js that loads external templates. Supports native and jQuery templates.
OTHER License
(MIT License)
##THIS PROJECT HAS BEEN RETIRED! ###(Do you want it?) My sincerest apologies to everyone who has been waiting on some kind of response to issues and/or PRs on this project. Writing open source software is something I love to do - but the unfortunate reality is that I only have so much time to spread between my various projects after I focus on the things that matter the most to me. I'm no longer using KnockoutJS on a daily basis (haven't been for a while), and if I were on a KO project, I'd be using RequireJS and an approach like what my friend Ryan Niemeyer recommends (to load external templates). This template engine extension was created for an internal intranet site where multiple round trips and non-bundling of dependencies wasn't really a problem. If you are building public facing sites, I highly recommend looking at Ryan's recommendations, and use a more substantial loader & module setup (like RequireJS), or have a build step that concats your templates into your host page(s) before deployment, etc.
If you are an active member of the KO OSS "community", and want to take over this project, I'm happy to hand it off to you. Just get in touch with me on twitter to start the conversation.
You can read the long-overdue blog on retiring this project here: Know When to Walk Away.
The Knockout.js External Template Engine extends Knockout.js to allow you to load templates asynchronously from a remote resource. It currently supports both native and jquery templates. Special thanks to Ryan Niemeyer for the assistance in getting jquery templates working in this version of the plugin.
The dependencies listed above are in the ext folder under in the repository.
Note: This project takes a depdency on a library called infuser. infuser no longer has an
infuser.config
object. It has been merged withinfuser.defaults
.
infuser.defaults.templateSuffix
valueinfuser.defaults.templatePrefix
valueinfuser.defaults.templateUrl
value.infuser.defaults.loadingTemplate.content
property.<div data-bind="template: { name: 'stats', templateUrl: 'templates/info'}"></div>
$.ajax
options two ways:
infuser.defaults.ajax
(example: infuser.defaults.ajax.cache = false
)<div data-bind="template: { name: 'stats', templateUrl: 'templates/info', ajax: { cache: false } }"></div>
See the example folder in the project for more information (& see below for how to run the examples). You can also use IIS on Windows if you make the root of the repository a virtual directory and then browse to example/{subfolder of choice}.
This project uses anvil.js for it's build/combine/minify/etc. To use anvil, you will need Node.js and npm. Three build outputs are produced in this project:
To run the build from the command line you do the following (at the project root): anvil -b
To run the examples, run anvil --host
. Examples will be accessible by going to http://localhost:3080/example under the following sub-folders:
Examples using the AMD module version can be found under http://localhost:3080/example/amd, in the following folders: