javascript - एनजी-शामिल का सही वाक्यविन्यास क्या है?




html5 include (5)

आपको डबल कोट्स के अंदर अपनी src string को सिंगल कोट करना होगा:

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

Source

मैं एक ng-repeat अंदर एक HTML स्निपेट शामिल करने की कोशिश कर रहा हूं, लेकिन मुझे काम करने के लिए शामिल नहीं किया जा सकता है। ऐसा लगता है कि ng-include इन का वर्तमान वाक्यविन्यास पहले की तुलना में अलग है: मैं कई उदाहरणों का उपयोग कर देखता हूं

<div ng-include src="path/file.html"></div>

लेकिन आधिकारिक दस्तावेज़ों में , यह उपयोग करने के लिए कहते हैं

<div ng-include="path/file.html"></div>

लेकिन फिर पेज के नीचे इसे दिखाया गया है

<div ng-include src="path/file.html"></div>

भले ही, मैंने कोशिश की

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

मेरा स्निपेट बहुत अधिक कोड नहीं है, लेकिन यह बहुत कुछ चल रहा है; मैंने ng-repeat अंदर गतिशील रूप से लोड टेम्पलेट में पढ़ा है कि इससे कोई समस्या हो सकती है, इसलिए मैंने sidepanel.html शब्द के साथ sidepanel.html की सामग्री को प्रतिस्थापित किया, और अभी भी कुछ भी नहीं।

मैंने टेम्पलेट को सीधे इस तरह के पृष्ठ में घोषित करने का भी प्रयास किया:

<script type="text/ng-template" id="tmpl">
    foo
</script>

और ng-include सभी बदलावों के माध्यम से चलना ng-include स्क्रिप्ट की id का संदर्भ देना, और अभी भी कुछ भी नहीं।

मेरे पृष्ठ में इसमें बहुत कुछ था, लेकिन अब मैंने इसे केवल नीचे कर दिया है:

<!-- index.html -->
<html>
<head>
<!-- angular includes -->
</head>
<body ng-view="views/main.html"> <!-- view is actually set in the router -->
    <!-- views/main.html -->
    <header>
        <h2>Blah</h2>
    </header>
    <article id="sidepanel">
        <section class="panel"> <!-- will have ng-repeat="panel in panels" -->
            <div ng-include src="views/sidepanel.html"></div>
        </section>
    </article>
<!-- index.html -->
</body>
</html>

हेडर प्रस्तुत करता है, लेकिन फिर मेरा टेम्पलेट नहीं करता है। मुझे कंसोल में या नोड से कोई त्रुटि नहीं मिलती है, और यदि मैं dev टूल में src="views/sidepanel.html" में लिंक पर क्लिक करता हूं, तो यह मुझे मेरे टेम्पलेट (और foo प्रदर्शित करता है) पर ले जाता है।


इसे इस्तेमाल करे

<div ng-app="myApp" ng-controller="customersCtrl"> 
  <div ng-include="'myTable.htm'"></div>
</div>

<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
    $http.get("customers.php").then(function (response) {
        $scope.names = response.data.records;
    });
});
</script>

उन लोगों के लिए जो आंशिक से कम से कम संभव "आइटम रेंडरर" समाधान की तलाश में हैं, इसलिए एनजी-दोहराना और एनजी-कॉम्बो का कॉम्बो शामिल है :

<div ng-repeat="item in items" ng-include src="'views/partials/item.html'" />

असल में, यदि आप इसे दोहराए जाने के लिए इस तरह इस्तेमाल करते हैं, तो यह काम करेगा, लेकिन उनमें से 2 के लिए नहीं होगा! कोणीय (v1.2.16) किसी कारण के लिए बाहर निकल जाएगा यदि आपके पास इनमें से 2 एक दूसरे के बाद हैं, इसलिए पूर्व-एक्सएचटीएमएल मार्ग को विभाजित करना सुरक्षित है:

<div ng-repeat="item in items" ng-include src="'views/partials/item.html'"></div>


यह मेरे लिए काम किया:

ng-include src="'views/templates/drivingskills.html'"

पूरा div:

<div id="drivivgskills" ng-controller="DrivingSkillsCtrl" ng-view ng-include src="'views/templates/drivingskills.html'" ></div>

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

या

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

या

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

याद दिलाने के संकेत:

-> src में कोई रिक्त स्थान नहीं है

-> src के लिए दोहरे उद्धरण में एकल उद्धरण का उपयोग करना याद रखें








repeater