简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
首頁 > web前端 > js教程 > 主體

AngularJS之表格

黄舟
發布： 2017-02-18 13:20:12
原創
1012 人瀏覽過

1、問題背景

     設計一個表格，樣式由Bootstrap決定的，資料由AngularJS決定的


<!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>
登入後複製

3 、達成結果




 以上是AngularJS之表格的內容，更多相關內容請追蹤


相關標籤：
AngularJS，表格，JavaScript
來源：php.cn
上一篇：文件上傳並展示上傳文件 下一篇：zTree點擊文字勾選複選框
本網站聲明
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn
作者最新文章
最新問題
如何在 Dash 中使表格的儲存格值超連結？ （使用 Plotly、Dash、Pandas 等） 我想將“JobLink”列下的儲存格值設為超連結。當我單擊此連結時，它應該導航到新選項卡/視窗中的連結。請幫忙如何實現？表在Dash中顯示，我發現很難使其超連結。附截圖：https...
來自於 2023-11-17 18:47:10
0
1
283
JavaScript中如何取得CSS/HTML命名顏色的RGB值 我已經建立了一個名為[name-rgb]的Javascript物件。你的基本:namedColors={AliceBlue:[240,248,255],AntiqueWhite:[...
來自於 2023-11-06 09:05:50
0
2
210
如何在 PHP 中複製 Excel FV 函數？ 我正在將一些相當複雜的計算從Excel電子表格轉換為PHP。我被困在Excel的FV函數的轉換上，它是這樣定義的：FV(interest_rate,number_payments,...
來自於 2023-11-04 15:54:09
0
1
254
在 PHP 中使用 ImageMagick 將 .HEIC 轉換為 .JPG 我希望嘗試建立一個小型影像轉換器，將上傳到phpWeb文件的HEIC檔案轉換為.JPG（或任何其他通用檔案格式）。我正在unix伺服器上運行PHP，並在伺服器上安裝了ImageMa...
來自於 2023-11-02 17:38:57
0
1
264
Vue.js 3 v-for 導致 Tailwind/Flowbite 模態功能出現問題 我試圖從表中呼叫順風模式，其中行是透過vue.js中的for循環使用v-for產生的，但該模式無法呼叫。不過，我生成的表沒有for循環，它工作得很好。這是程式碼：表格程式碼（有v-...
來自於 2023-11-02 13:36:09
0
1
300
相關專題
更多>
熱門推薦
熱門教學
更多>
相關教學
熱門推薦
最新課程
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網：公益線上PHP培訓，幫助PHP學習者快速成長！