क्या dust.js टेम्पलेट्स को समकालिक रूप से प्रस्तुत करना संभव है?

Question

मैं हुड के नीचे dust.js का उपयोग करने के लिए क्लाइंट-साइड एचटीएमएल/जेएस टेम्पलेटिंग सिस्टम के लिए एडाप्टर लिखने की कोशिश कर रहा हूं। दुर्भाग्यवश एपीआई को सिंक्रनाइज़ेशन होने के लिए संचालन प्रस्तुत करने की अपेक्षा करता है: प्रस्तुत आउटपुट रेंडर() कॉल से वापस किया जाना चाहिए। Dust.js असीमित है और कॉलबैक फ़ंक्शन में आउटपुट प्रस्तुत करता है। क्या इसके आसपास काम करने का कोई तरीका है, या तो धूल एपीआई में या कुछ पागल जावास्क्रिप्ट हैक के माध्यम से?

Answer 1

डस्टजेएस केवल उन चीजों को निष्पादित करने जा रहा है जब संसाधनों को प्रस्तुत करने की आवश्यकता होती है (टेम्पलेट्स, आंशिक) पहले ही लोड नहीं हो चुके हैं।

यदि टेम्पलेट की सभी निर्भरताओं को उस टेम्पलेट को निष्पादित करने से पहले लोड किया जाता है तो यह सिंक्रनाइज़ निष्पादित करेगा (जहां तक ​​मैं किसी भी तरह बता सकता हूं)।

var result; 
dust.render("tpl", data, function(err, res) { 
    result = res; 
}); 
console.log(result); // result will actually already be filled out if dustjs didn't 
// have to go look for resources somewhere. 

यहाँ नीचे एक संपूर्ण उदाहरण है:: तो आप की तरह कुछ कर सकते हैं के अलावा

मामलों

<script type="text/javascript" src="dust.js"></script> 
<script> 
    var tpl = dust.compile("Omg {#people} {.} {/people} are here! {>partial/}", "tpl"); 
    var partial = dust.compile("I'm a partial but I've already been included so things still run {how}", "partial"); 
    dust.loadSource(tpl); 
    dust.loadSource(partial); 

    var data = { 
     people: ["jim", "jane", "jack", "julie"], 
     how: "synchronously!" 
    }; 

    var result; 
    dust.render("tpl", data, function(err, res) { 
     result = res; 
    }); 
    console.log(result); 
</script> 

हो सकती है (: (http://jsfiddle.net/uzTrv/1/ और यहाँ एक jsfiddle कड़ी है आप इसे चलाते हैं तो कर सकते हैं) मैंने जो उल्लेख किया है) जहां मैं गलत हूं ... मुझे dustjs के बारे में सबकुछ पता नहीं है।

Answer 2

मैं भी एक ऐसा कार्य करना चाहता था जिसने एक संदर्भ स्वीकार किया और धूल प्रदान किए गए पाठ को वापस कर दिया। यहाँ समाधान मैं के साथ आया है:

// This function sets up dust template, and returns a new function "dusterFn()" 
// dusterFn() can be passed a Context, and will return the rendered text. 
// @param {String} text: The template text. 
// @param {String} [name]: The name of the template to register with dust. If none is provided, a random number is used. 
// @param {Function} [onError]: A function that is called if an error occurs during rendering. 
function getDusterFn(text, name, onError) { 

    var dusterFn = null; 
    name = name || Math.floor(Math.random() * 99999).toString(); 
    onError = onError || function (error) { }; 

    try { 

     var compiled = dust.compile(text, name) 
     dust.loadSource(compiled); 

     dusterFn = function (context) { 
      var dustOutput = ''; 
      dust.render(name, context, function (error, out) { 
       if (error) onError(error); 
       dustOutput = out; 
      }); 
      return dustOutput; 
     }; 

    } catch (e) { 
     // invalid template syntax 
     e += "\n\nPlease check your template syntax."; 
     throw (e); 
    } 

    return dusterFn; 

} 

प्रयोग

var greetingTemplate = getDusterFn('Hello {name}, You are {age} years old!'); 
greetingTemplate({name: 'Jane', age: 24}); 

Answer 3

मैट समाधान मुझे कैसे एक छोटे से आवरण कि खाल उसके समाधान के "कुरूपता" लिखने के लिए पर कुछ संकेत दे दी है (द्वारा "कुरूपता" मेरा मतलब है कॉलबैक के बाहर परिवर्तनीय घोषित करना, कॉलबैक के अंदर मूल्य असाइन करना और कॉलबैक के बाहर लौटना)।

यह न केवल एक छोटे से फ़ंक्शन में हैक को लपेटता है बल्कि टेम्पलेट के नाम को भी बांधता है। मुझे यह अविश्वसनीय मदद मिलती है क्योंकि मैं खुद को एक ही रेंडर फ़ंक्शन का बार-बार उपयोग करके ढूंढता हूं, लेकिन मैं हर बार टेम्पलेट के नाम को निर्दिष्ट नहीं करना चाहता हूं।

function templates(template) { 
    return function templatesWrapper(data) { 
    var result; 
    dust.render(template, data, function onRender(err, data) { 
     if (err) { 
     throw err; 
     } 
     result = data; 
    }); 
    return result; 
    } 
} 

यह है कि यह कैसे उपयोग करने के लिए है:

var renderHello = templates('hello.html'); 
renderHello({ username: 'Stackoverflow' }); 
// => <h1>Hello, Stackoverflow</h1>