博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
AngularJS 表格
阅读量:5319 次
发布时间:2019-06-14

本文共 940 字,大约阅读时间需要 3 分钟。

ng-repeat 指令可以完美的显示表格。

在表格中显示数据

{
{ x.Name }}
{
{ x.Country }}

使用 CSS 样式

为了让页面更加美观,我们可以在页面中使用CSS:

使用 orderBy 过滤器

排序显示,可以使用 orderBy 过滤器: 

{
{ x.Name }}
{
{ x.Country }}

使用 uppercase 过滤器

使用 uppercase 过滤器转换为大写: 

{
{ x.Name }}
{
{ x.Country | uppercase }}

结果如图:

显示序号 ($index)

表格显示序号可以在 <td> 中添加 $index

{
{ $index + 1 }}
{
{ x.Name }}
{
{ x.Country }}

结果如图:

使用 $even 和 $odd

{
{ x.Name }}
{
{ x.Name }}
{
{ x.Country }}
{
{ x.Country }}

结果如图:

转载地址:http://www.runoob.com/angularjs/angularjs-tables.html

转载于:https://www.cnblogs.com/moqiutao/p/4863161.html

你可能感兴趣的文章
【转】javascript 中的很多有用的东西
查看>>
Centos7.2正常启动关闭CDH5.16.1
查看>>
Android 监听返回键、HOME键
查看>>
Android ContentProvider的实现
查看>>
sqlserver 各种判断是否存在(表名、函数、存储过程等)
查看>>
给C#学习者的建议 - CLR Via C# 读后感
查看>>
Recover Binary Search Tree
查看>>
Java 实践:生产者与消费者
查看>>
[转]IOCP--Socket IO模型终结篇
查看>>
js 获取视频的第一帧
查看>>
各种正则验证
查看>>
观察者模式(Observer)
查看>>
python中numpy.r_和numpy.c_
查看>>
egret3D与2D混合开发,画布尺寸不一致的问题
查看>>
freebsd 实现 tab 命令 补全 命令 提示
查看>>
struts1和struts2的区别
查看>>
函数之匿名函数
查看>>
shell习题第16题:查用户
查看>>
实验4 [bx]和loop的使用
查看>>
Redis常用命令
查看>>