7

मैं इनपुट तत्व के लिए angularUI typehead का उपयोग कर रहा हूं। मैं मूल्य दिखाने के लिए कस्टम टेम्पलेट का उपयोग कर रहा हूँ। यह सब ठीक काम कर रहा है। मेरा सवाल यह है कि मैं ng-template को एक अलग फ़ाइल में कैसे अलग कर सकता हूं ताकि इसे अन्य फ़ाइलों में भी पुन: उपयोग किया जा सके।एनजी-टेम्पलेट को अलग फ़ाइल में अलग कैसे करें

// custom template begin 
// this is the ng-template 
// I'd like to move this custom template into to another file 
// similar to partials 
<script type="text/ng-template" id="customTemplate.html"> 
    <a> 
     <b>{{match.model.name}}</b> 
     <div>{{match.model.username}}</div> 
    </a> 
</script> 
//custom template end 


// input element makes use of the ng-template defined above 
<div class="form-group"> 
<label class="col-md-2 control-label normal" for="assignTo">Assign To</label> 
<div class="col-md-3"> 
    <input name="bug_assignTo" id="bug_assignTo" ng-model="bug.assignTo" typeahead="user.username as user.name for user in config.users | filter:$viewValue | limitTo:8" class="form-control input-sm" typeahead-on-select="bug.assignTo = $item" placeholder="type name" typeahead-template-url="customTemplate.html"></input> 
</div> 

में यह लाना:

मामले में मेरे शब्दों को स्पष्ट नहीं, कृपया ध्यान दें रहे हैं कि मैं ng-templates को विशेष रूप से और न चिंतित जिक्र कर रहा हूँ अलग अन्य html सामग्री

यहाँ के बारे में कोड है एक आंशिक काम नहीं किया, उदाहरण के लिए: <div ng-include="app/client/bug/new/my-ng-template.partial.html"></div> फेंकता है:

Tried to load angular more than once. 
[$rootScope:infdig] 10 $digest() iterations reached. Aborting! 
... 
.... 

उत्तर

11

आपको ng-include की आवश्यकता नहीं है।

अलग फ़ाइल में टेम्पलेट ले जाएँ, की सुविधा देता है की तरह

<a> 
    <b>{{match.model.name}}</b> 
    <div>{{match.model.username}}</div> 
</a> 

कहना फ़ाइल नाम customTemplate.html और फ़ाइल सामग्री <script type="text/ng-template" id="customTemplate.html"> टैग शामिल न करें जब यह अलग फ़ाइल में ले जाया जाता है।

तरह

<input name="bug_assignTo" 
       id="bug_assignTo" 
       ng-model="bug.assignTo" 
       typeahead="user.username as user.name for user in config.users | filter:$viewValue | limitTo:8" 
       class="form-control input-sm" 
       typeahead-on-select="bug.assignTo = $item" 
       placeholder="type name" 
       typeahead-template-url="customTemplate.html" /> <!--put correct physical path here, if it is inside partial folder then use partial/customTemplate.html--> 
+0

धन्यवाद, कि काम सही फ़ाइल पथ का प्रयोग करें। – Sudhakar

+0

शायद एक बेवकूफ सवाल है, लेकिन क्या टेम्पलेट $ टेम्पलेट का उपयोग करता है उदाहरण के लिए जब यह स्क्रिप्ट टैग में टाइप = "टेक्स्ट/टेम्पलेट" के साथ नहीं है? –

+0

हां आप $ टेम्पलेट कैश का उपयोग कर सकते हैं – Reza

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