How to write dustjs in php code without nodejs

问题

Current I did the dustjs in client javascript as below

<!DOCTYPE html>
<html>
<head>
  <script src="lib/dust-full-0.3.0.min.js" type="text/javascript"></script>
  <script src="vendor/jquery-1.7.1.min.js" type="text/javascript"></script>
  <script type="text/javascript">
  $(document).ready(function(){

  // JSON response from server 
  var json_object = { "profile_skill": "Profile Skill",
      "skills": [
            { "name": "JavaScript"  },
            { "name": "Ruby" },
            { "name": "Java" }
      ]
    }
  // render method

    dustRender = function(){
      // Get the dust html template to dust compile
      var dust_tag = $('#page').html() ; 

      var compiled = dust.compile(dust_tag, "tmp_skill");
      //load templates
      dust.loadSource(compiled);
      //Renders the named template and calls callback on completion. context may be a plain object or an instance of dust.Context.
      dust.render("tmp_skill", json_object, function(err, html_out) {
      //HTML output
         $('#page').html(html_out);
          console.log(html_out);
      });
    }();


  });

</script>

</head>
<body>
<h1>Dust templates in the browser</h1>
<div id="page">

{profile_skill}
  <ul> {#skills} 
      <li> {name} </li> 
      {/skills}
  </ul>
</div>


</body>
</html>

But in my page view source I can see the above code instead of html tag output. And also I want know how to integrate dustjs in php code.

回答1:

As Torsten Walter has mentioned, you cannot see the html source in your page, if you are compiling/rendering in browser. If you do the compiling and rendering in the server side, html source will contain the final HTML code. For achieving this, you can use nodejs or Rhino server as mentioned in Linkedin blog: http://engineering.linkedin.com/frontend/leaving-jsps-dust-moving-linkedin-dustjs-client-side-templates

This might help you to compile the dust templates using PHP,

https://github.com/saravmajestic/myphp/tree/master/dustcompiler

This utility is only for compiling the dust templates before rendering in the page, which will avoid compiling time in your browser. You can load the compiled templates as a JS file in your page, which can be minified/ aggregated with other JS files/templates.

Hope this helps!!!

回答2:

Don't just put your template inside the php. Do it properly and define the template as a string or separate html file.

var templateName = "myTemplate";
var model = { "profile_skill": "Profile Skill",
    "skills": [
        { "name": "JavaScript"  },
        { "name": "Ruby" },
        { "name": "Java" }
    ]
};



dust.onLoad = function(templateName, callback) {
    // this will load a template with [name].html in the folder templates
    // callback is an internal dust.js function
    $.get(["templates/", ".html"].join(templateName), function(data) {
        callback(undefined, data);
    }, "html"); 
};


// dust just takes the template name as first parameter
// if no template of this name is defined it will attempt to load
// and compile it if needed
// override dust's onLoad function to implement your loading

dust.render(templateName, model, function(err, out){
    $('#page').html(out);
});

Inside my template.html

{profile_skill}
<ul> {#skills} 
    <li> {name} </li> 
    {/skills}
</ul>

Of course the point is that compiling your templates always speeds up delivery and rendering. However, since you deliver the template together with the rest of your page, calling loadSource and compile is just not necessary. Instead dust will try to load a temploate all by itself if you tell it to do so.

From the documentation:

Loading

(...)

By default Dust returns a "template not found" error when a named template cannot be located in the cache. Override onLoad to specify a fallback loading mechanism (e.g., to load templates from the filesystem or a database).

Internally dust will call the loadSource and compile methods itself if it has to. In my example above I included a possible soulution to override dust.onLoad. Of course you could also simply return a the html contents of a DOM node there.

dust.onLoad = function(templateName, callback) {
    callback(undefined, $("skill template").hmtml());
}

And to answer your last question:

And also I want know how to integrate dustjs in php code.

You can't. Unless you send the template to client to render there or you have a JavaScript interpreter on your backend to render the templates you can't use it.

来源：https://stackoverflow.com/questions/11909293/how-to-write-dustjs-in-php-code-without-nodejs

标签

php

jquery

dust.js