twig

2017-11-22 17 views
5

का उपयोग कर तैयार करने के लिए उपयोग किए जाने वाले साझा तत्वों का निर्माण करना मैं एक ऐसे प्रोजेक्ट पर काम कर रहा हूं जिसमें बहुत सारे साझा तत्व हैं, उदा। पाद लेख, हेडर, नेविगेशन, आदि। मेरे पास कुछ लेआउट हैं जो मैं अपने विचारों में विस्तार करता हूं। अभी के लिए, मैं अपने दृश्य के अंदर साझा तत्व लोड कर रहा हूं, लेकिन मुझे प्रत्येक साझा तत्व के लिए आवश्यक सभी संपत्तियां (निर्भरता) प्रदान करने की आवश्यकता है, जिसे मैं इसे लोड कर रहा हूं। मैं उस चरण को छोड़ने और उस तत्व को लोड करने में सक्षम होना चाहता हूं जो वास्तव में उपयोग के लिए वास्तव में तैयार होगा (इसलिए मुझे सभी आश्रित जावास्क्रिप्ट और सीएसएस फ़ाइलों को याद रखने की आवश्यकता नहीं होगी, क्योंकि उनमें से कुछ में कुछ हो सकते हैं) ।twig

मैं तत्व के दृश्य के अंदर साझा तत्व के लिए आवश्यक सभी संपत्तियों को निर्दिष्ट करने के बारे में सोच रहा था, इसलिए जब मुझे आवश्यक तत्व शामिल होता है, तो यह मेरे विचारों के अंदर सभी को निर्दिष्ट किए बिना संपत्तियों को स्वचालित रूप से लोड करेगा। तो मेरा सवाल यह है कि ऐसा करना संभव है या इसे पूरा करने का सही तरीका क्या है?

आशा है कि इसे और भी बेहतर कोड का उपयोग कर समझाया जाएगा:

संरचना:

views/ 
- /layout/ 
    -> layout.twig 
- /homepage/ 
    -> index.twig 
- /shared/ 
    -> navigation.twig 

लेआउट:

<!-- HTML headers, etc. --> 
{% block assets %} 
    <link rel="stylesheet" href="xxx" /> 
{% endblock %} 

{% block content %} 

{% endblock %} 

दृश्य:

{% extends "layout/layout.twig" %} 
{% block assets %} 
    {{ parent() }} 
    <!-- some assets for view -->  
{% endblock %} 
{% block content %} 
    {% include "shared/navigation.twig" %} 
    <!-- content --> 
{% endblock %} 

साझा तत्व navigation.twig :

// It's not working, of course - just for better explanation of what I'm trying to approach 
{% block assets %} 
    {{ parent() }} 
    <!-- assets needed for shared element --> 
{% endblock %} 
<!-- rest of shared element --> 

मुझे लगता है, आम तौर पर, आप विचारों में सभी परिसंपत्तियों को लोड नहीं के रूप में कुछ साझा तत्वों विशेष रूप से बड़े प्रोजेक्ट में, उनमें से एक बहुत कुछ हो सकता है है। साथ ही, मुझे लगता है कि यह इंगित करना अच्छा लगता है कि मैं वास्तव में <body> के अंदर शैलियों को प्रस्तुत करना नहीं चाहता हूं, इसलिए दृश्य के अंदर <links> बनाना मेरे लिए जाने का कोई तरीका नहीं है। यह एक साझा तत्व की तरह काम करने के लिए है, जिससे आप नियंत्रित कर सकते हैं कि आपकी संपत्ति कहां लोड की जाएगी और यह जानने के बिना कि प्रत्येक साझा तत्व के लिए किन संपत्तियों की आवश्यकता है, बिना संपत्तियां लोड की जाएंगी। पहले ही, आपका बहुत धन्यवाद।

+0

हैलो, क्या आपने स्टाइलशीट्स और जावास्क्रिप्ट ब्लॉक को अलग से उपयोग करने का प्रयास किया है? –

+0

मुझे यकीन नहीं है कि आप इसका क्या मतलब रखते हैं। जब मैं साझा तत्व की बात करता हूं, तो मैं उन्हें अलग करता हूं, स्क्रिप्ट ज्यादातर साझा तत्व के दृश्य के अंत में होती हैं (जो ठीक है, लेकिन मैं उन्हें शरीर के अंत में रखना चाहूंगा) और स्टाइलशीट दृश्य से लोड की जाती हैं खुद (जो मेरे लिए एक समस्या है, क्योंकि मैं उन्हें उनके विचार में लिखने में सक्षम होना चाहता हूं और उन्हें सिर के अंदर लोड करना चाहता हूं) –

+1

सबसे अच्छा अभ्यास सिम्फनी दस्तावेज में समझाया गया है: https://symfony.com/doc /3.4/templating.html#including- स्टाइलशीट-and-javascripts-in-twig –

उत्तर

1

documentation on use से:

क्षैतिज पुन: उपयोग ... मुख्य रूप से परियोजनाओं टेम्पलेट ब्लॉक विरासत का उपयोग किए बिना पुन: प्रयोज्य बनाने की जरूरत है कि द्वारा किया जाता है।

use वर्तमान फ़ाइल में एक बाहरी फ़ाइल को शामिल किया गया, स्थानीय स्तर पर अनन्य मान ब्लॉक का नाम बदलने के विकल्प के साथ। इन स्थानीय रूप से अद्वितीय मानों को तब इंजेक्शन दिया जा सकता है - block - विरासत पदानुक्रम में।

उदाहरण। आधार "जनक" से शुरू करें:

<head> 
    {% block assets %} 
    <link rel='stylesheet' href='layout.css' /> 
    {% endblock %} 
</head> 
<body> 
    <div id='layout' class='content'> 
    {% block content %} 
    {% endblock %} 
    </div> 
</body> 

मेनू को परिभाषित करें, "घटक" हम "का पुन: उपयोग" होगा बाद में:

{% block assets %} 
    <link rel='stylesheet' href='menu.css' /> 
{% endblock %} 
{% block content %} 
    <div id='menu' class='content'></div> 
{% endblock %} 

अब, उन दो को एक साथ लाने।गौर करें कि हम extends आधार आईएनजी, लेकिन फिर use हैं block साथ घटक आईएनजी और पुन: उपयोग अपने ब्लॉक:

{% extends "layout.twig" %} 

{% use "menu.twig" with assets as menu_assets, content as menu_content %} 

{% block assets %} 
    {{ parent() }} 
    <link rel='stylesheet' href='view.css' /> 
    {{ block('menu_assets') }} 
{% endblock %} 

{% block content %} 
    <div class='menu'> 
    {{ block('menu_content') }} 
    </div> 
    <div id='view' class='content'></div> 
{% endblock %} 

पैदावार:

<head> 
    <link rel='stylesheet' href='layout.css' /> 
    <link rel='stylesheet' href='view.css' /> 
    <link rel='stylesheet' href='menu.css' /> 
</head> 
<body> 
    <div id='layout' class='content'> 
    <div class='menu'> 
     <div id='menu' class='content'> 
     </div> 
    </div> 
    <div id='view' class='content'></div> 
    </div> 
</body> 

यह काफी "के साथ ब्लॉक परिभाषित के जादू नहीं है वही नाम और वे सभी संयुक्त हो जाते हैं ", लेकिन यह बहुत करीब है। आपका लेआउट मेनू के बारे में नहीं जानता है, और मेनू लेआउट के बारे में नहीं जानता है: लेकिन वे दोनों "संपत्ति" और "सामग्री" नामक ब्लॉक पर सहमत हैं। दृश्य फिर उनको सही विरासत रूप में जोड़ता है।

+1

महान, धन्यवाद। दस्तावेज़ों को पढ़ने के दौरान मैं शायद अंधा था। –

संबंधित मुद्दे