मैं हैंडलबार टेम्पलेट के अंदर console.log() जावास्क्रिप्ट तर्क कैसे जोड़ूं?

Question

मैं एक नया उल्का ऐप बनाने की प्रक्रिया में हूं और मैं अपने प्रत्येक लूप से पहले console.log() चलाने के लिए हैंडलबार्स के साथ जावास्क्रिप्ट तर्क जोड़ने का तरीका नहीं समझ सकता। रीढ़ की हड्डी में, मैं यह जांचने के लिए <% console.log(data); %> करूँगा कि डेटा पास किया जा रहा था।
मुझे यकीन नहीं है कि मीटियर और हैंडलबार के साथ ऐसा कैसे करें और मुझे उनकी साइट पर समाधान नहीं मिला।

Answer 1

अपनी परियोजना में ग्राहक-लोडेड जावास्क्रिप्ट फ़ाइलों में से एक में एक Handlebars सहायक बनाएँ:

Template.registerHelper("log", function(something) { 
    console.log(something); 
}); 

और फिर अपने खाके में इसे कहते:

{{log someVariable}} 

आप के साथ वर्तमान संदर्भ प्रवेश कर सकते हैं बस {{log this}}।

(ध्यान दें कि उल्का में संस्करण 0.8 से पहले, या एक उल्का ऐप के बाहर शुद्ध Handlebars में, Handlebars.registerHelper साथ Template.registerHelper बदलें।)

Answer 2

मैं लगता है इस सहायक काफी उपयोगी हो

Handlebars.registerHelper("debug", function(optionalValue) { 
    console.log("Current Context"); 
    console.log("===================="); 
    console.log(this); 
    if (optionalValue) { 
     console.log("Value"); 
     console.log("===================="); 
     console.log(optionalValue); 
    } 
}); 

तो आप दो तरीके

सिर्फ एक सरल

{{debug}} 

में उपयोग कर सकते हैं

जो वर्तमान संदर्भ

बाहर प्रिंट होगा या एक ही मूल्य

{{debug val}} 

सिर्फ इतना है कि मूल्य

Answer 3

Handlebars v3 बाहर मुद्रित करने के लिए अब लॉग सहायक में एक का निर्माण किया है निरीक्षण करने के लिए। आप एक टेम्पलेट के भीतर

{{log this}} 

से कंसोल के लिए लॉग इन कर सकते तुम इतनी

Handlebars.logger.level = 0; // for DEBUG 

Answer 4

मैं यह कर की तरह लॉगिंग स्तर सेट कर सकते हैं,

Handlebars.registerHelper('log', function(content) { 
    console.log(content.fn(this)); 
    return ''; 
}); 

जो मुझे एक डिबगर कोड करने के लिए अनुमति देता है ब्लॉक, टेम्पलेटिंग सिस्टम का उपयोग करके मैं अंदर बैठ गया हूँ। इसलिए मैं इसे एक ब्लॉक दे सकता हूं और यह सामग्री को हल करेगा लेकिन इसे कंसोल.लॉग पर भेज देगा।

{{#log}} title is {{title}} {{/log}} 

मैं भी स्वयं टेम्पलेट के अलावा और कुछ संपादित करने के लिए बिना मुझे फिर से प्रयोग करने योग्य कार्यात्मक ब्लॉक में मेरे टेम्पलेट सूख करने की इजाजत दी इस

$('script[type="text/x-handlebars-template"]').each(function(){ 
    Handlebars.registerPartial(this.id,$(this).html()); 
}); 

जो मेरे सारे टेम्पलेट्स आंशिक रूप से उपलब्ध कराता है करते हैं, ।

तो मैं अब चीजों की तरह

{{#log}}Attribute listing {{>Attributes}}{{log}} 

<script id="Attributes" type="text/x-handlebars-template"> 
{{#each attributes}} 
    {{@key}}={{this}} 
{{/each}} 
</script> 

Answer 5

मैं हमेशा निम्नलिखित सहायक का उपयोग के साथ क्या कर सकते हैं: यह डेटा लॉग करता है और एक वैकल्पिक ब्रेकप्वाइंट कहते हैं। इस तरह से आप ब्राउज़र डीबगर ;-)

में वर्तमान Handlebars संदर्भ निरीक्षण कर सकते हैं पर https://gist.github.com/elgervb/5c38c8d70870f92ef6338a291edf88e9

/** 
* Register a debug helper for Handlebars to be able to log data or inspect data in the browser console 
* 
* Usage: 
* {{debug someObj.data}} => logs someObj.data to the console 
* {{debug someObj.data true}} => logs someObj.data to the console and stops at a debugger point 
* 
* Source: https://gist.github.com/elgervb/5c38c8d70870f92ef6338a291edf88e9 
* 
* @param {any} the data to log to console 
* @param {boolean} whether or not to set a breakpoint to inspect current state in debugger 
*/ 
Handlebars.registerHelper('debug', function(data, breakpoint) { 
    console.log(data); 
    if (breakpoint === true) { 
     debugger; 
    } 
    return ''; 
});