demo
Penerangan fungsi:
Realisasikan fungsi menyemak imbas maklumat pelajar pada satu halaman. Pertama, nama semua pelajar dipaparkan dalam senarai, kemudian, apabila nama pelajar diklik dalam senarai, halaman maklumat terperinci pelajar dimasukkan. Paparkan semua maklumat tentang pelajar ini.
5-7.html
<!DOCTYPE html> <html lang="en" ng-app="a5_7"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript" src="../bower_components/angular/angular.min.js"></script> <script type="text/javascript" src="../bower_components/angular-route/angular-route.min.js"></script> <style> body{ font-size:13px; } .show{ background-color:#cccccc; padding:8px; width:260px; margin:10px 0; } </style> </head> <body> <h1>浏览学生信息的主页</h1> <p ng-view></p> </body> <script type="text/javascript"> var a5_7 = angular.module('a5_7',['ngRoute']); a5_7.controller('c5_7_1',['$scope', function($scope){ $scope.students = students; }]); a5_7.controller('c5_7_2',['$scope', function($scope,$routeParams){ for(var i=0; i<students.length; i++){ // console.log(students.student[i]); if(students[i].stuId == $routeParams.id){ $scope.student = students[i]; break; } } }]); a5_7.config(['$routeProvider', function($routeProvider){ $routeProvider.when('/',{ controller:'c5_7_1', templateUrl:'5-7-1.html' }).when('/view/:id',{ controller:'c5_7_2', templateUrl:'5-7-2.html', publicAccess:true }).otherwise({ redirectTo:'/' }); }]); var students = [ { stuId:1000, name:'张明明',sex:'女',score:60}, { stuId:1001, name:'李清思',sex:'女',score:80}, { stuId:1002, name:'刘小华',sex:'男',score:90}, { stuId:1003, name:'陈总总',sex:'男',score:70} ] </script> </html>
5-7-1.html
<p ng-repeat="stu in students" class="show"> <a href="#view/:id">{{stu.name}}</a> </p>
5-7-2.html
rreeee
Langkah operasi:
1 Mula-mula buka 5-7.html
2 Klik pada nama pelajar 
3 >
Apa yang menyebabkan ini? Adakah masalah dengan ayat ini? href="#view/:id"
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Sila tukar kepada