angularJS(九)angularJsDemo之内置服务$http

最新推荐文章于 2019-08-01 14:41:05 发布

佐杰

最新推荐文章于 2019-08-01 14:41:05 发布

阅读量245

点赞数

分类专栏： angularJs

本文链接：https://blog.csdn.net/OnlyoneFrist/article/details/89047548

版权

angularJs 专栏收录该内容

11 篇文章 2 订阅

订阅专栏

需求如下：

这里需要注意的是$http内置服务需在tomcat中运行

要实现这个需求我这里建了一个json文件

[
	{"name":"zhangsan","yuwen":100,"shuxue":100},
	{"name":"lisi","yuwen":90,"shuxue":90},
	{"name":"wangwu","yuwen":80,"shuxue":70},
	{"name":"zhaoliu","yuwen":60,"shuxue":90}
]

实现代码如下

<html>
	<head>
	    <meta charset="utf-8">
		<title>AngularJs入门小demo7-内置服务$http</title>
		<script type="text/javascript" src="angular.min.js"></script>
		<script >
			//建立模块
			var app=angular.module("myapp",[]);
			//创建控制器$scope就是控制层与视图层交换数据的桥梁
			app.controller("myController",function($scope,$http){
				$scope.findList=function(){
					$http.get("data.json").success(
						function(response){
							$scope.list=response;
						}		
					);
				}
			});
		
		</script>
		
		
	</head>
	<body ng-app="myapp" ng-controller="myController" ng-init="findList()">
		<table>
			<tr>
				<td>姓名</td>
				<td>数学</td>
				<td>语文</td>
			</tr>
			<tr ng-repeat="entity in list">
				<td>{{entity.name}}</td>
				<td>{{entity.shuxue}}</td>
				<td>{{entity.yuwen}}</td>
			</tr>
		</table>
	</body>
</html>

佐杰

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
angularJS(九)angularJsDemo之内置服务$http

需求如下：这里需要注意的是$http内置服务需在tomcat中运行要实现这个需求我这里建了一个json文件[ {"name":"zhangsan","yuwen":100,"shuxue":100}, {"name":"lisi","yuwen":90,"shuxue":90}, {"name":"wangwu","yuwen":80,"shuxue":70}, {"n...
复制链接

扫一扫