AngularJS एनजी-इनक्लूड को तब तक शामिल नहीं किया जाता जब तक कि $ स्कोप में पास नहीं किया जाता


121

क्या यह मान ngIncludeलेना गलत है कि कच्चा रास्ता अपना सकते हैं? मैं अपने ngIncludeको इस प्रकार सेट करने का प्रयास करता रहता हूं :

<div ng-include src="views/header.html"></div>

यह काम नहीं करता है लेकिन अगर मैं ऐसा कुछ करता हूं तो यह काम करता है।

// HeaderController
app.controller('HeaderCtrl', function($scope){
   $scope.templates = {[
     template: { url: 'views/header.html' }
   ]};

   $scope.template = $scope.templates[0].template;
});

मेरे index.html में

<div ng-controller="HeaderCtrl">
  <div ng-include src="template.url"></div>
</div>

क्या ngIncludeकेवल गुंजाइश के मूल्यों को छोड़कर? यदि ऐसा है तो यह इस तरह से क्यों है और html आंशिक के एक सीधे शामिल नहीं है।

जवाबों:


327

ng-includeएक अभिव्यक्ति स्वीकार करता है। यदि आप स्पष्ट URL को सीधे वहाँ निर्दिष्ट करना चाहते हैं, तो आपको एक स्ट्रिंग देनी होगी।

<div ng-include src="'page.html'"></div>

हाँ बस वही देखा। उदाहरण जिन्हें मैं देख रहा था वे कोणीय के पुराने संस्करण का उपयोग कर रहे थे।
चाड

44
इस दोपहर को बहुत समय बिताया। का पाठ्यक्रम यह एक स्ट्रिंग की जरूरत है। जो पूर्ण समझ में आता है।
कोड व्हिस्परर

अनुप्रयोग मॉड्यूल में सक्षम ngSanitize के साथ काम नहीं करता है। मैं इसका हल ढूंढ रहा हूं।
दीदा

4
एक और बात: पृष्ठ में फ़ाइल नाम के रूप में अंडरस्कोर नहीं हो सकता है।

5
छोटे एकल उद्धरण समस्या को हल करते हैं। मैं सटीक परिवर्तन (मेरी खराब आंख) नहीं देख सका। कृपया शब्दों में दोहरे उद्धरण चिह्नों के अंदर एकल उद्धरण जोड़ें।
फेजर खान

1

ng-includeअन्य निर्देशों के रूप में ( ng-class, ng-src...) एक कोणीय अभिव्यक्ति का मूल्यांकन करता है दायरे से। उद्धरण के बिना ( ''), यह गुंजाइश के एक चर के लिए खोज करेगा।


ध्यान दें कि आपको srcविशेषता निर्दिष्ट करने की आवश्यकता नहीं है ।

<div ng-include src="'views/header.html'"></div>

के लिए फिर से लिखा जा सकता है: (यह सरल है)

<div ng-include="'views/header.html'"></div>

तुम भी एक तत्व के रूप में एनजी शामिल का उपयोग कर सकते हैं :

<ng-include src="'views/header.html'"></ng-include>
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.