Good Javascript template engine to work with JSON

I have looked at jTemplates and it's worth a try. Are there any other template engines other than jTemplates?

Answers:

Answer

I liked the approach the JavaScriptMVC Frameworks Views take, especially because it uses JavaScript itself as the templating language. The framework is now based on jQuery and you can render your Model right into the views (Model supports JSON, JSONP, XML etc.).

Answer

Did you try pure.js ?

The main difference with the dozens of JS templating engines available is that PURE leaves the HTML totally separated from the JS logic. And it's pretty fast too.

However it is not the common <% ... %> kind of templating programming you may like.
It has a pattern/declarative approach which has some similarity with XSLT (but without the pain...)

Answer

Here is one implemented in jQuery for the Smarty templating language. http://www.balupton.com/sandbox/jquery-smarty/demo/

One impressive feature is the support for dynamic updates. So if you update a template variable, it will update anywhere in the template where that variable is used. Pretty nifty.

You can also hook into variable changes using a onchange event. So that is useful for say performing effects or AJAX when say the variable "page" changes ;-)

Answer

Yajet is a new one, spotting a syntax different from anything we've seen before. :-) It compiles the templates and it's blazing fast. It's browser and library-agnostic; there is a small jQuery wrapper for people who can't live without jQuery, but the engine itself is independent and can run in Rhino or V8 too.

It supports many directives that allow conditionals, loops, define reusable template components etc.

Answer

After having this question in 2017, it looks like JsRender and JsViews have emerged as the current official implementation of templating within the jQuery ecosystem (whilst not necessarily requiring jQuery):

JsRender is a light-weight but powerful templating engine, highly extensible, and optimized for high-performance rendering, without DOM dependency. It is designed for use in the browser or on Node.js, with or without jQuery.

JsRender and JsViews together provide the next-generation implementation of the official jQuery plugins JQuery Templates, and JQuery Data Link -- and supersede those libraries.

- JsRender GitHub Readme

Official Site: http://www.jsviews.com/

GitHub (JsRender): https://github.com/BorisMoore/jsrender

GitHub (JsViews): https://github.com/BorisMoore/jsviews

Answer

Try async-js-templates. Its fast because it does paralell requests that can be async.

It is shiped with maven.

Answer

You can use this one: https://jocapc.github.io/jquery-view-engine/

It binds properties of JSON object into empty HTML template and match properties with elements by name, id, or class.

First, you would need to have plain HTML template in your page:

<div id="template">
    <h1 id="Name"></h1>
    <label>Description:</label>
    <textarea name="Desc"></textarea>
    <ul>
        <li class="bind-Tags"></li>
    </ul>
</div>

Then you need JS object that will be placed in template:

var data = {   Name: "JOVN",
    Desc: "The simplest view engine",
    Tags: ["View engine", "JavaScript", "SPA"]
}

Finally just fill the view with the data object:

$("div#template").view(data);

Result is:

<div id="template">
    <h1 id="Name">JOVN</h1>
    <label>Description:</label>
    <textarea name="Desc">The simplest view engine</textarea>
    <ul>
        <li class="bind-Tags">View engine</li>
        <li class="bind-Tags">JavaScript</li>
        <li class="bind-Tags">SPA</li>
    </ul>
</div>

View engine will populate single fields or replicate array elements in template.

Answer

Its worth looking at the following link.

https://github.com/nje/jquery/wiki/jquery-templates-proposal

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.