मैं विभिन्न HTML फ़ाइलों से टेम्पलेट्स को कैसे जोड़ूं

Question

चूंकि नॉकआउट के व्यक्तिगत टेम्पलेट्स स्क्रिप्ट टैग में रखे जाते हैं, इसलिए मैंने सोचा कि मैं टैग की src विशेषता सेट कर सकता हूं और HTML को एक अलग फ़ाइल से लोड कर सकता हूं। ऐसा करने से भोलेपन से बस काम नहीं किया है, तो या तो

1. वहाँ src टैग है कि मैं
2. अलग फ़ाइलों
से टेम्पलेट्स लोड करने के लिए एक अलग तरह से नहीं है उपयोग करने की आवश्यकता के साथ काम करने के लिए टेम्पलेट्स के बंधन हो रही करने के लिए कुछ चाल है

(अन्य दो संभावनाएं - 3, इस परियोजना के सभी प्रोग्रामरों को एक ही विशाल फ़ाइल को संशोधित करने की उम्मीद है, जो स्टार्ट-अप पर ब्राउज़र द्वारा लोड किया जाएगा, और 4, नॉकआउट्स का उपयोग न करें एक खिलौना परियोजना से बड़ा कुछ भी - मैं समकक्ष मानता हूं।)

Answer 1

कोई ब्राउज़र src पर किसी भी चीज़ पर प्रतिक्रिया नहीं देगा जिसमें विभिन्न प्रकार के 'जावास्क्रिप्ट' प्रकारों में से एक के अलावा एक प्रकार है और साथ ही यह परिणाम को स्क्रिप्ट के रूप में निष्पादित करने का प्रयास करेगा।

कई विकल्प हालांकि:

• उपयोग एक टेम्पलेट इंजन है कि टेम्पलेट्स दूर से खींच सकते हैं (सबसे अच्छा एक यहाँ है: https://github.com/ifandelse/Knockout.js-External-Template-Engine)।

• अपने स्क्रिप्ट टैग पर लूप जिसमें टेम्पलेट्स हैं और उन्हें लोड करें। इस तरह कुछ स्थान के रूप में src का उपयोग कर सामग्री खींच जाएगा। जब आप आवेदन कॉल करते हैं तो आपको सावधान रहना होगा बाइंडिंग, यदि आपके टेम्पलेट तैयार नहीं हैं। http://www.knockmeout.net/2011/03/using-external-jquery-template-files.html

Answer 2

प्रत्येक टेम्पलेट अपने प्रोजेक्ट में अपनी ही html फ़ाइल है:

$("script[type='text/html']").each(function(index, el) { $.get($(el).attr("src"), 
    function(response) { 
     $(el).text(response); }); 
}); 

यहाँ कुछ अन्य विकल्प है कि मैं समय पहले यह एक करने के लिए को देखा जा सकता है। मैं उन्हें पहचानने के लिए एक नामकरण सम्मेलन (* .ko.html) का उपयोग करता हूं। मेरे निर्माण श्रृंखला इस प्रकार है:

चरण 1: एक प्रकार का वृक्ष और कम करें * .ko.html फ़ाइलों यह सिर्फ टिप्पणियां (<!-- ko --> लोगों को छोड़कर) को दूर करने के लिए और एक अधिक कॉम्पैक्ट पेलोड के लिए अतिरिक्त व्हाइट पट्टी है।

चरण 2: एक जेएस फ़ाइल में स्ट्रिंगिफ़ाई और संक्षिप्त मिनीटाइम एचटीएमएल। js तरह

var templates={ 
    'name1':'some stringified html', 
    'name2':'some more' 
}; 

मैं <script type="text/plain"> सीमांकक के साथ एक HTML फ़ाइल में श्रृंखलाबद्ध पर विचार लेकिन क्योंकि इस तरह से यह लोड किया जा सकता एक सरल <script> बजाय टैग एक ajax प्राप्त + इंजेक्षन का उपयोग कर js चुना था कुछ लग रहा है।

चरण 3: मेरे जेएस ऑब्जेक्ट से टेम्पलेट्स को पुनर्प्राप्त करने के लिए मूल टेम्पलेट इंजन को ठीक करें।

var engine = new ko.nativeTemplateEngine(); 
engine._makeTemplateSource = engine.makeTemplateSource; 

engine.makeTemplateSource = function (template, doc) {   
    if (typeof (template) === 'string' && templates[template]) { 
     return { text: function() { return templates[template]; } }; 
    } 
    return engine._makeTemplateSource(template, doc); 
}; 
ko.setTemplateEngine(engine); 

मेरे कार्यान्वयन gruntjs का उपयोग करता है इन चरणों का निर्माण करने के लिए।(घुरघुराना-योगदान-htmlmin, घुरघुराना-योगदान-concat) htmlmin के लिए

विकल्प: सोच क्यों किसी को भी ऐसा करना चाहते हैं हैं concat

{ 
    stripBanners: true, 
    banner: "(function(t){", 
    footer: "})(window.templates || (window.templates={}));", 
    process: function (src, file) { 
     return 't[\'' + file.replace(/^.*\//, '').replace('.ko.html', '') + '\']=' + JSON.stringify(src) + ';'; 
    } 
} 

के लिए

{ 
removeComments: true, 
collapseWhitespace: true, 
ignoreCustomComments: [/^\s*ko /, /^\s*\/ko /] 
} 

विकल्प किसी के लिए: टेम्पलेट स्रोत फ़ाइलें मानक व्यक्तिगत एचटीएमएल फाइलें हैं जिन्हें किसी भी एचटीएमएल संपादक और स्रोत में संपादित किया जा सकता है। <script> टैग के अंदर HTML संपादित करना कोई मजेदार नहीं है। बोनस के रूप में, स्रोत फ़ाइलों में टिप्पणियां शामिल हो सकती हैं जिन्हें हटा दिया जाएगा। टेम्पलेट्स स्क्रिप्ट टैग सहित किसी भी पृष्ठ पर पुन: उपयोग करने योग्य हैं: उन्हें प्रत्येक पृष्ठ में रेखांकित करने की आवश्यकता नहीं है। परिणामी बंडल एक स्थिर फ़ाइल है जो ब्राउज़र आसानी से कैश कर सकते हैं, जबकि एक गतिशील रूप से जेनरेट किए गए पृष्ठ में एम्बेडेड टेम्पलेट्स नहीं कर सकते हैं। जावास्क्रिप्ट फ़ाइलों को बंडल करने के लिए बहुत अधिक कारण हैं।