AngularJS ng-repeat 遍历数组

最新推荐文章于 2021-06-23 08:00:15 发布

houyanhua1

最新推荐文章于 2021-06-23 08:00:15 发布

阅读量1.6k

点赞数

CC 4.0 BY-SA版权

分类专栏： AngularJS 文章标签： angularjs ng-repeat

本文链接：https://blog.youkuaiyun.com/houyanhua1/article/details/80117873

AngularJS 专栏收录该内容

30 篇文章

订阅专栏

本文介绍了一个使用 AngularJS 的简单示例，演示了如何通过 ng-repeat 指令来遍历并显示明星数据数组。该示例展示了 AngularJS 中的数据绑定及控制器的使用方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

demo.html：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>AngularJS</title>
	<script src="angular.min.js"></script>  <!-- 引入AngularJS框架 -->
</head>
<body ng-app="App">
	
	<div ng-controller="DemoController">
		<ul>
			<li ng-repeat="(key,star) in stars">第{{key+1}}个：{{star.name}} {{star.age}}</li>  <!-- ng-repeat遍历数组 -->
		</ul>
	</div>

	<script>
		
		var App = angular.module('App',[]);

		App.controller("DemoController",['$scope',function($scope) {
			
			$scope.stars = [
				{name:'刘德华',age:60},
				{name:'周杰伦',age:50},
				{name:'王力宏',age:40},
				{name:'成龙',age:30}
			];

		}]);
		
	</script>
</body>
</html>