AngularJS ng-repeat
निर्देश
उदाहरण
रिकॉर्ड्स ऐरे में प्रत्येक आइटम के लिए एक हेडर लिखें:
<body ng-app="myApp" ng-controller="myCtrl">
<h1 ng-repeat="x in records">{{x}}</h1>
<script>
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
$scope.records = [
"Alfreds Futterkiste",
"Berglunds snabbköp",
"Centro comercial Moctezuma",
"Ernst Handel",
]
});
</script>
</body>
परिभाषा और उपयोग
निर्देश HTML के ng-repeat
एक सेट को एक निश्चित संख्या में दोहराता है।
संग्रह में प्रति आइटम एक बार HTML के सेट को दोहराया जाएगा।
संग्रह एक सरणी या वस्तु होना चाहिए।
नोट: पुनरावृत्ति के प्रत्येक उदाहरण को अपना दायरा दिया जाता है, जिसमें वर्तमान आइटम शामिल होता है।
यदि आपके पास वस्तुओं का संग्रह है, तो ng-repeat
निर्देश HTML तालिका बनाने के लिए एकदम सही है, प्रत्येक ऑब्जेक्ट के लिए एक तालिका पंक्ति प्रदर्शित करता है, और प्रत्येक ऑब्जेक्ट प्रॉपर्टी के लिए एक तालिका डेटा प्रदर्शित करता है। नीचे उदाहरण देखें।
वाक्य - विन्यास
<element ng-repeat="expression"></element>
सभी HTML तत्वों द्वारा समर्थित।
पैरामीटर मान
Value | Description |
---|---|
expression | An expression that specifies how to loop the collection. Legal Expression examples: x in records
(key, value) in myObj |
और ज्यादा उदाहरण
उदाहरण
रिकॉर्ड सरणी में प्रत्येक आइटम के लिए एक तालिका पंक्ति लिखें:
<table ng-controller="myCtrl" border="1">
<tr ng-repeat="x in records">
<td>{{x.Name}}</td>
<td>{{x.Country}}</td>
</tr>
</table>
<script>
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
$scope.records = [
{
"Name" : "Alfreds Futterkiste",
"Country" : "Germany"
},{
"Name" : "Berglunds snabbköp",
"Country" : "Sweden"
},{
"Name" : "Centro comercial Moctezuma",
"Country" : "Mexico"
},{
"Name" : "Ernst Handel",
"Country" : "Austria"
}
]
});
</script>
उदाहरण
किसी वस्तु में प्रत्येक गुण के लिए एक तालिका पंक्ति लिखें:
<table ng-controller="myCtrl" border="1">
<tr ng-repeat="(x, y) in myObj">
<td>{{x}}</td>
<td>{{y}}</td>
</tr>
</table>
<script>
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
$scope.myObj = {
"Name" : "Alfreds Futterkiste",
"Country" : "Germany",
"City" : "Berlin"
}
});
</script>