2011-08-10 12 views
13

मैं .html फ़ाइलों के समूह में टेम्पलेट विरासत करने का एक तरीका ढूंढ रहा हूं।क्लाइंट-साइड (जावास्क्रिप्ट) Django/Jinja- जैसे टेम्पलेट विरासत

मान लें कि मेरे पास base.html फ़ाइल है जिसमें मेरी वेबसाइट के सभी पृष्ठों, यानी हेडर, पाद लेख इत्यादि के लिए सामान्य HTML है। मुख्य (अनुक्रमणिका) पृष्ठ सहित प्रत्येक पृष्ठ को इस टेम्पलेट HTML फ़ाइल से प्राप्त करने की आवश्यकता है।

अब, यह Django's Jinja template langauge का उपयोग कर सर्वर-साइड पर करने योग्य है। लेकिन यह मेरे लिए एक अच्छा समाधान नहीं है। मेरे एचटीएमएल पेज दूरस्थ रूप से संग्रहीत हैं और मेरे पास संग्रहित सर्वर पर मेरा कोई नियंत्रण नहीं है। यह जावास्क्रिप्ट के साथ या बिना, क्लाइंट-साइड किया जाना चाहिए।

Somebody asked about this before, और मुझे मिला केवल आधा बेक्ड समाधान Mustache's partials का उपयोग करना था, जो वास्तव में काम नहीं करता है।

क्या कोई क्लाइंट-साइड पर ऐसा करने का तरीका जानता है?

उत्तर

2

1. हाँ, Dustjs साथ आप कर सकते हैं "एक टेम्पलेट एक आम आधार टेम्पलेट से अपनी सामग्री के थोक के वारिस है"।

डस्टज डॉक्स देखें, यहां: Dustjs, "ब्लॉक और इनलाइन आंशिक" अनुभाग।

(मैं एक संबंधित प्रश्न का उत्तर पोस्ट, यहाँ: https://stackoverflow.com/a/12432034/694469)


2. वहाँ भी, मेरा के लिए एक और जवाब देखने Handlebars करने के लिए टेम्पलेट विरासत जोड़ने पर प्रगति में कुछ काम है " अन्य संस्करण "इस प्रश्न का: https://stackoverflow.com/a/12432490/694469

यह इस GitHub मुद्दे के लिए लिंक: https://github.com/wycats/handlebars.js/issues/208, और इस ब्लॉग पोस्ट: Template Inheritance for Handlebars

0

jQuery टेम्पलेट में {{wrap}} टेम्पलेट टैग है जिसका उपयोग इस के लिए किया जा सकता है।

+3

मैं यहाँ एक उदाहरण प्रलेखन से अपहरण कर लिया है ऐसा नहीं लगता कि यह टेम्पलेट विरासत की अनुमति देता है, बस मूंछ के आंशिक समान व्यवहार। क्या अापको उस बारे में पूर्ण विशवास है? –

1

जेड पूर्ण टेम्पलेट विरासत प्रदान करता है: https://github.com/visionmedia/jade#a11

इसके अलावा पूरी तरह से एक ब्लॉक अधिभावी के लिए, आप भी संलग्न या करने के लिए आगे जोड़ते सामग्री कर सकते हैं एक ब्लॉक।

layout.html में किसी मूल टेम्पलेट को परिभाषित करें::

html 
    head 
    h1 My Site - #{title} 
    block scripts 
     script(src='/jquery.js') 
    body 
    block content 
    block foot 
     #footer 
     p some footer content 

कुछ स्क्रिप्ट टैग संलग्न और content.html में सामग्री अनुभाग बदल देते हैं:

extends layout 

block append head 
    script(src='/vendor/three.js') 
    script(src='/game.js') 

block content 
    .sidebar 
    block sidebar 
     p nothing 
    .primary 
    block primary 
     p nothing 
संबंधित मुद्दे