简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Rumah > hujung hadapan web > tutorial js > teks badan

AngularJS之表格

黄舟
Lepaskan： 2017-02-18 13:20:12
asal
1011 orang telah melayarinya

1、问题背景

     设计一个表格，样式由Bootstrap决定的，数据由AngularJS来决定的


2、实现源码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>AngularJS之表格</title>
		<link rel="stylesheet" href="../css/bootstrap.css" />
		<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
		<script>
			var app = angular.module("tableApp",[]);
			app.controller("tableCon",function($scope){
				$scope.datas = [
					{name:"张三",age:"23"},
					{name:"李斯",age:"22"},
					{name:"王五",age:"21"},
					{name:"赵倩",age:"24"},
					{name:"五月",age:"25"}
				]
			});
		</script>
	</head>
	<body>
		<p ng-app="tableApp" ng-controller="tableCon">
			<table class="table table-bordereds" style="text-align: center;">
				<thead>
					<tr>
						<th style="text-align: center;">姓名</th>
						<th style="text-align: center;">年龄</th>
					</tr>
				</thead>
				<tr ng-repeat="data in datas">
					<td>{{data.name}}</td>
					<td>{{data.age}}</td>
				</tr>
			</table>
		</p>
	</body>
</html>
Salin selepas log masuk


3、实现结果



 以上就是AngularJS之表格的内容，更多相关内容请关注PHP中文网（www.php.cn）！


Label berkaitan：
AngularJS，表格，JavaScript
sumber：php.cn
Artikel sebelumnya：文件上传并展示上传文件 Artikel seterusnya：zTree点击文字勾选复选框
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Isu terkini
Bagaimana untuk membuat nilai sel jadual hyperlink dalam Dash? (Menggunakan Plotly, Dash, Panda, dll.) Saya ingin menetapkan nilai sel di bawah lajur "JobLink" sebagai hiperpautan. Ap...
daripada 2023-11-17 18:47:10
0
1
283
Bagaimana untuk mendapatkan nilai RGB warna bernama CSS/HTML dalam JavaScript Saya telah mencipta objek Javascript yang dipanggil [name-rgb]. Asas anda:namedColors={Ali...
daripada 2023-11-06 09:05:50
0
2
210
Bagaimana untuk menyalin fungsi Excel FV dalam PHP? Saya sedang menukar beberapa pengiraan yang agak rumit daripada hamparan Excel kepada PHP....
daripada 2023-11-04 15:54:09
0
1
254
Tukar .HEIC kepada .JPG menggunakan ImageMagick dalam PHP Saya berharap untuk mencuba dan mencipta penukar imej kecil yang menukar fail HEIC yang di...
daripada 2023-11-02 17:38:57
0
1
264
Vue.js 3 v-for menyebabkan masalah dengan fungsi mod Tailwind/Flowbite Saya cuba memanggil corak tailwind daripada jadual di mana baris dijana menggunakan v-for ...
daripada 2023-11-02 13:36:09
0
1
300
Topik-topik yang berkaitan
Lagi>
Cadangan popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina：Latihan PHP dalam talian kebajikan awam，Bantu pelajar PHP berkembang dengan cepat！