angularJs表格效果
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.staticfile.org/angular.js/1.6.3/angular.min.js"></script>
<style>
table {
border-collapse: collapse;
} table,th, td{
border: 1px solid black;
} table
{
width:%;
}
th
{
height:100px;
} </style> </head>
<body> <div ng-app="myApp" ng-controller="customersCtrl"> <table>
<tr ng-repeat="x in names">
<td>{{ x.Name }}</td>
<td>{{ x.Country }}</td>
</tr>
</table> </div> <script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
$http.get("/try/angularjs/data/Customers_JSON.php")
.then(function (result) {
$scope.names = result.data.records;
});
});
</script> </body>
</html>
样式调节学习：
border-collapse 属性设置表格的边框是否被折叠成一个单一的边框或隔开
Width和height属性定义表格的宽度和高度。
下面的例子是设置100％的宽度，50像素的th元素的高度的表格：
text-align属性设置水平对齐方式，向左，右，或中心：
angularJs表格效果的更多相关文章
- 【09】AngularJS 表格
AngularJS 表格 ng-repeat 指令可以完美的显示表格. 在表格中显示数据 使用 angular 显示表格是非常简单的: <div ng-app="myApp" ...
- AngularJS表格神器“ui-grid”的应用
HTML: (代码仅用于解释得更清楚,并未完全展示) <!doctype html> <html ng-app="app"> <head> & ...
- AngularJS 表格
ng-repeat 指令可以完美的显示表格. 使用 angular 显示表格是非常简单的: <!DOCTYPE html> <html> <head> <me ...
- angularjs购物车效果
用angularjs写了一个购物车效果中. html代码: <div png-app="myAp" ng-controller="conTroll"> ...
- Angularjs 表格插件的使用
对于相关的table组件可以使用:UI Grid (ng-grid),ng-table,smart table,Angular-Datatables,tablelite,kendo-ui中的grid. ...
- DIV+ul+LI实现表格效果以及div带滑动条
写这个是为了给自己一个好好的笔记,以免下次需要的时候又到处找,费神费事费时费力.开始吧! 1.先看看效果 2.网页代码 <!DOCTYPE html PUBLIC "-//W3C//D ...
- angularjs表格方式显示数据
<table> <tr ng-repeat="x in names"> <td>{{ x.Name }}</td> <td&g ...
- AngularJS表格排序
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- AngularJS 表格(带有CSS样式)
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
随机推荐
- C99标准新特性的说明
C99标准新特性的说明 一.说明 ====== 这里的讨论的是C语言的国际标准,即国际标准化组织ISO,制定的C语言标准.历史上ISO制定过4个版本的C语言标准,他们分别是:C90(ISO/IEC ...
- canvas二进制字符下落
? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 3 ...
- 什么是HUD
[什么是HUD] 游戏HUD的意思: 说直白点就是在屏幕上显示你的游戏相关信息,让玩家可以随时了解那些最重要最直接相关的内容.就是说,像我们玩游戏的时候,显示您的武器耐久度不够了,您的血量不足了等等. ...
- 把Oracle的数据导入到SQL2012中 导出数据－－SSIS
在ORACLE表和SQL Server表之间'转换'那步很重要,可以改变默认的字段数据类型,如image->text,decimal->int number ->int (注意设置 ...
- 使用Fuel安装openstack
一.前言 Fuel是OpenStack的开源部署和管理工具.作为OpenStack社区的开发贡献者,它为OpenStack.OpenStack相关社区项目以及OpenStack插件的部署和管理提供了直 ...
- linux top 命令各参数详解
简介 top命令是Linux下常用的性能分析工具,能够实时显示系统中各个进程的资源占用状况,类似于Windows的任务管理器. top显示系统当前的进程和其他状况,是一个动态显示过程,即可以通过用户按 ...
- 50. Pow(x, n) 幂次方
［抄题］: mplement pow(x, n), which calculates x raised to the power n (xn). Example 1: Input: 2.00000, ...
- 面试题:servlet jsp cook session 背1
一.Servlet是什么?JSP是什么?它们的联系与区别是什么? Servlet是Java编写的运行在Servlet容器的服务端程序,狭义的Servlet是指Servlet接口,广义的Servlet是 ...
- Linux文件系统操作命令
Linux文件系统操作命令 文件系统操作命令: 1. cat:可以显示文件的内容(经常和more搭配使用),或将多个文件合并成一个文件. 2. chgrp:用来改变文件或目录所属的用户组,命令的参数以 ...
- 初次接触URDF
使用URDF创建机器人3D仿真模型 在真实的机器人上编程可以更好地让我们理解机器人的控制方式,因为真实的机器人会有反馈.如果没有真实的机器人,那么ROS仿真是一个很好的选择. ROS通过URDF(Un ...