หลายโครงการทำบนเว็บเซิร์ฟเวอร์ front-end และรหัส jsp เขียน back-end ทั้งสองฝ่ายต้องทำงานร่วมกันอย่างใกล้ชิดเพื่อแยกแยะความรับผิดชอบ บางโครงการให้วิธีการพักผ่อนโดยแบ็กเอนด์และส่วนหน้าเรียกร้องให้วนซ้ำกับ AJAX โดยปกติจะเป็นสายการสะกดคำ jQuery จำนวนมากซึ่งไม่ได้ใช้งานง่ายเกินไป บางคนสร้างเทมเพลต JS แต่ก็ไม่ดีขึ้นมากนัก
มันสนุกมากขึ้นในการใช้ AngularJs และไวยากรณ์คล้ายกับ JSP:
<! doctype html> <html ng-app> <head> <meta charset = "utf-8"> <title> directive ng-repeat </title> </head> <body> <body> <body> <ttr lifler </th> th> th> th> th> th> ราคา </th> <th> ปริมาณ </th> <th> จำนวนเงิน </th> <th> การดำเนินการ </th> </tr> <ttr ng-repeat = "รายการในรายการ"> <td> {{$ index + 1}} </td> <td> {item.name} สกุลเงิน}} </td> <td> <อินพุต ng-model = "item.quantity"> </td> <td> {{item.quantity * item.price | สกุลเงิน}} </td> <td> <button ng-click = "ลบ ($ index)"> ลบ </button> </td> </td> </tr> </table> <script src = "../lib/angularjs/1.2.26/angular.min.js" {ชื่อ: "Rapoo (Rapoo) V500 Keyboard Game Mechanical Keyboard Mechanical Yellow Axle", ปริมาณ: 1, ราคา: 199.00}, {ชื่อ: "Rapoo V20 Optical Gaming Mouse Black Flame Edition", ปริมาณ: ราคา: 139.00}, {ชื่อ: $ scope.remove = ฟังก์ชั่น (ดัชนี) {$ scope.items.splice (ดัชนี, 1); }} </script> </body> </html>ชีวิต Directive NG-Repeat อยู่ในองค์ประกอบที่จำเป็นต้องวนเนื้อหา รายการสอดคล้องกับชื่อตัวแปรบนคอนโทรลเลอร์ รายการเป็นนามแฝงสำหรับวัตถุเดียวในอาร์เรย์ $ index สามารถส่งคืนหมายเลขคำสั่งซื้อของวัตถุอ้างอิงปัจจุบันเริ่มต้นจาก 0 และ $ แรก, $ middle และ $ สุดท้ายสามารถส่งคืนค่าบูลีนเพื่อบอกคุณว่าองค์ประกอบปัจจุบันเป็นองค์ประกอบสุดท้ายในช่วงกลางแรกของคอลเลกชันหรือไม่