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 ...
随机推荐
- 季逸超：90后IT少年的“盖茨梦”
2月15日,"90后"独立开发者季逸超在其微博称,个人获得徐小平和红杉资本投资,成立了Peak Labs--以贝尔和施乐为目标的实验室. 谁是季逸超?他现年20岁,曾单独一人做出猛 ...
- DAY.15_Python
昨天完成了三级菜单和购物车程序的作业: """ .__author__.=,"JerseyHg" 作业要求:1. 可依次选择进入到下一级菜单:2. 可 ...
- C# 文件打印
Process pr = new Process(); pr.StartInfo.FileName = “C:\test.xls”; ...
- 面试题:彻底理解ThreadLocal 索引的利弊 背1
.索引利弊 --整理 1.索引的好处 a.提高数据检索的效率,降低检索过程中必须要读取得数据量,降低数据库IO成本. b.降低数据库的排序成本.因为索引就是对字段数据进行排序后存储的,如果待排序的 ...
- ssh时传递环境变量
设置要传递的变量: -o SendEnv=Varname 但是不是每个都能传,受服务器上sshd_config里的下面两个选项的控制: AcceptEnv and PermitUserEnvironm ...
- Django--model模型绑定_数据库操作
1.创建model类 app01/models.py 1 2 3 4 5 6 7 from django.db import models # Create your models here. c ...
- Tarjan算法求出强连通分量（包含若干个节点）
[功能] Tarjan算法的用途之一是,求一个有向图G=(V,E)里极大强连通分量.强连通分量是指有向图G里顶点间能互相到达的子图.而如果一个强连通分量已经没有被其它强通分量完全包含的话,那么这个强连 ...
- 2.8.2 并发下的ArrayList，以及源码分析
package 第二章.并发下的ArrayList; import java.util.ArrayList;import java.util.List; /** * Created by zzq on ...
- Zynq 在Ubuntu上搭建编译环境
http://bbs.elecfans.com/jishu_487981_1_1.html 以下操作均在root用户下完成1,下载交叉编译器在ubuntu里下载arm-2010.09-62-arm-x ...
- datagrid 自定义 pager
$(document).ready(function(){ var p = $('.easyui-datagrid').datagrid('getPager'); $(p).pagination({ ...