| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title></title> | |
| <script src="libs/angular.min.js"></script> | |
| <script> | |
| var app= angular.module("gaoynApp",[]); | |
| app.controller("democ",["$scope","$http",function($scope,$http){ | |
| $scope.getData=function(){ | |
| console.log(">>>>>>>>>>>>"); | |
| //通过http请求服务端一个json数据串 | |
| //• $http.get(url)适用于读取数据的函数 | |
| //stars.json url | |
| $http.get("stars.json").then(function(resp){ | |
| //获取真正的数据源 本质就是数组 | |
| $scope.datas=resp.data; | |
| }); | |
| } | |
| }]); | |
| </script> | |
| </head> | |
| <body ng-app="gaoynApp" ng-controller="democ"> | |
| <input type="button" value="获取数据" ng-click="getData()" /> | |
| 服务器端返回的数据 | |
| <table border="1px"> | |
| <tr ng-repeat="data in datas"> | |
| <td>{{data.name}}</td> | |
| <td> | |
| <img width="100px" src={{data.photo}} alt="图片无法加载显示"/> | |
| </td> | |
| <td>{{data.age}}</td> | |
| <td>{{data.sex}}</td> | |
| </tr> | |
| </table> | |
| </body> | |
| </html> |
[
{
"name": "王力宏",
"photo": "./images/wlh.jpg",
"ablum": "<<改变自已>>",
"age": 39,
"sex": "男"
},
{
"name": "李力宏",
"photo": "./images/xue1.jpg",
"ablum": "<<改变自已>>",
"age": 39,
"sex": "男"
},
{
"name": "王力宏",
"photo": "./images/xue2.jpg",
"ablum": "<<改变自已>>",
"age": 39,
"sex": "男"
},
{
"name": "王力宏",
"photo": "./images/wlh.jpg",
"ablum": "<<改变自已>>",
"age": 39,
"sex": "男"
}
]
扫一扫
70
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
