CODEWITHSUNDEEP
jsrender
Luke
Luke

Reputation: 181

How to use external html template with jsrender

I'm new in jsrender and I have some questions. I read some other discussions, but I don't understand how to do what I want.

I made everything work with jsrender using an external js file with this content:

$.templates('test', '<div>{{:name}}</div>');

and loading it with:

function lazyGetTemplate(name) {
  // If the named remote template is not yet loaded and compiled
  // as a named template, fetch it. In either case, return a promise
  // (already resolved, if the template has already been loaded)
  var deferred = $.Deferred();
  if ($.templates[name]) {
    deferred.resolve();
  } else {
    $.getScript(
      "/template/"
              + name + ".js")
      .then(function() {
        if ($.templates[name]) {
          deferred.resolve();
        } else {
          alert("Script: \"" + name + ".js\" failed to load");
          deferred.reject();
        }
      });
  }
  return deferred.promise();
}

function showPeople() {
  $.when(
    lazyGetTemplate("test")

  )
    .done(function() {
      var html = $.templates.test.render(MyObject);
      $("#dest").html(html);
    });
}

Can I have an external template with only html? Having html inside javascript syntax on one line is not readable.

I tried also another way to do that, with tmpl.loader (https://github.com/stevenmhunt/tmpl.loader). With this I define the html template inside and then I can render it with:

$.tmplLoader.ready(function() {
    $('#dest').html($.tmplLoader('user-info', MyObject));
});

So, is it possible to define html for template in external file that is no a .js and where I have html defined without $.templates directive?

Thanks

Upvotes: 0

Views: 4425

Answers (1)

BorisMoore
BorisMoore

Reputation: 8524

In addition to the sample here

http://www.jsviews.com/#samples/jsr/composition/remote-tmpl

which you have followed, there are two very simple samples here:

http://www.jsviews.com/#compiletmpl

The first sample: "...Registering a template from a markup string (in this case, fetched from the server in a script file)" uses a js file.

But the second sample: "...here is a variant of the same sample, where we fetch a text file containing the template markup" uses a .txt file (which could alternatively be a .html file) containing markup.

Upvotes: 4

Related Questions