Angularjs ng-repeat directive
อินสแตนซ์ Angularjs
วนซ้ำหลายชื่อ:
<! doctype html> <html> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js" ng-repeat = "x ในบันทึก"> {{x}} </h1> <script> var app = angular.module ("myapp", []); app.controller ("myctrl", ฟังก์ชั่น ($ scope) {$ scope.records = [ 4 ",]}); </script> </body> </html>คำจำกัดความและการใช้งาน
คำสั่ง NG-repeat ใช้เพื่อวนองค์ประกอบ HTML ของจำนวนครั้งที่ระบุ
คอลเลกชันจะต้องเป็นอาร์เรย์หรือวัตถุ
ไวยากรณ์
<องค์ประกอบ ng-repeat = "expression"> </element>
องค์ประกอบ HTML ทั้งหมดสนับสนุนคำสั่งนี้
ค่าพารามิเตอร์
| ค่า | อธิบาย |
|---|---|
| การแสดงออก | นิพจน์กำหนดวิธีลูปคอลเลกชัน กฎอินสแตนซ์นิพจน์: x ในบันทึก (คีย์, ค่า) ใน myobj x in records ติดตามโดย $ id (x) |
ตัวอย่างเพิ่มเติม
อินสแตนซ์ Angularjs
ใช้อาร์เรย์เพื่อวนออกตาราง:
<! doctype html> <html> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js" ng-controller = "myctrl"> <tr ng-repeat = "x ในระเบียน"> <td> {{x.name}} </td> <td> {x.country}} </td> </td> ฟังก์ชั่น ($ scope) {$ scope.records = [{"ชื่อ": "Alfreds Futterkiste", "Country": "Germany"}, {"Name": "Berglunds Snabbk", "Country": "Sweden"}, {"ชื่อ": Handel "," Country ":" Austria "}]}); </script> </body> </html>ผลการทำงาน:
| Alfreds Futterkiste | ประเทศเยอรมนี |
| berglunds snabbk | สวีเดน |
| centro comercial moctezuma | เม็กซิโก |
| เอิร์นส์ฮันเดล | ประเทศออสเตรีย |
อินสแตนซ์ Angularjs
ใช้วัตถุเพื่อวนเพื่อส่งออกตาราง:
<! doctype html> <html> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js" ng-controller = "myctrl"> <tr ng-repeat = "(x, y) ใน myObj"> <td> {{x}} </td> <td> {{y}} </td> </trolloll> </table> ฟังก์ชั่น ($ scope) {$ spope.myobj = {"ชื่อ": "Alfreds Futterkiste", "Country": "Germany", "City": "Berlin"}}); </script> </body> </html>ผลการทำงาน:
| ชื่อ | Alfreds Futterkiste |
| ประเทศ | ประเทศเยอรมนี |
| เมือง | กรุงเบอร์ลิน |
ข้างต้นเป็นข้อมูลพื้นฐานที่แยกแยะคำสั่ง angularjs ng-repeat และจะเสริมในภายหลัง