指令过滤器orderBy
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta http-equiv="X-UA-Compatible"content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<title></title>
<meta charset="utf-8" />
<link rel="stylesheet"href="bootstrap-3.3.6-dist/css/bootstrap.min.css" />
</head>
<body>
<div class="container"style="padding:50px">
<div data-ng-app="myApp"data-ng-controller="myCtrl">
<ul>
<li data-ng-repeat="x in person | orderBy:'age'">{{x.name+" "+x.age}}</li>
</ul>
</div>
</div>
<script src="jQuery/jquery-2.1.4.min.js"></script>
<script src="bootstrap-3.3.6-dist/js/bootstrap.min.js"></script>
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<script>
angular.module("myApp", []).controller("myCtrl", function ($scope) {
$scope.person = [
{ name: "zhangsan", age: 33 },
{ name: "lisi", age: 32 },
{ name: "wangwu", age: 36 },
{ name: "zhaoliu", age: 28 },
{name:"mazi",age:30},
]
})
</script>
</body>
</html>
指令过滤器orderBy的更多相关文章
- Vue.js 第2章 钩子函数&自定义指令&过滤器&计算属性&侦听器
目标 钩子函数 自定义指令 自定义过滤器 计算属性 监听属性 局部自定义指令 为什么需要自定义指令 为了复用,为了代码的灵活 指令的分类:全局指令,局部指令 在vm外面创建的指令 通过Vue.dire ...
- AngularJS快速入门指南19：示例代码
本文给出的大部分示例都可以直接运行,通过点击运行按钮来查看结果,同时支持在线编辑代码. <div ng-app=""> <p>Name: <input ...
- AngularJS：实例
ylbtech-AngularJS:实例 1.返回顶部 1. AngularJS 实例 实例 您可以在线编辑实例,然后点击按钮查看结果. AngularJS 实例 <div ng-app=&qu ...
- Vue 过滤器与计算属性
过滤器 V1.x 版本 过滤器基础 过滤器是一个通过输入数据,能够及时对数据进行处理并返回一个数据结果的简单函数.Vue有很多很便利的过滤器,可以参考官方文档,http://cn.vuejs.org/ ...
- 【AngularJS学习笔记】01 指令、服务和过滤器
AngularJS 指令是扩展的 HTML 属性,带有前缀 ng-. 比如: ng-app 指令初始化一个 AngularJS 应用程序.注意ng-app一般为空,如果值不为空,就得加这样一句代码va ...
- 【学】AngularJS日记（4）- 过滤器的使用
过滤器: 过滤器中的 |json,可以使原来的json数据输出时按照换行的样式 过滤器 | limitTo:2可以截取字符串或者数组的前2位 过滤器| orderBy 可以进行排序,加入json里的k ...
- Vue自带的过滤器
gitHub地址:https://github.com/lily1010/vue_learn/tree/master/lesson05 一 过滤器写法 {{ message | Filter}} 二 ...
- vue从入门到进阶：自定义指令directive，插件的封装以及混合mixins（七）
一.自定义指令directive 除了核心功能默认内置的指令 (v-model 和 v-show),Vue 也允许注册自定义指令.注意,在 Vue2.0 中,代码复用和抽象的主要形式是组件.然而,有的 ...
- vue1.0 的过滤器
vue1.0 自带的过滤器: 一 .过滤器写法 {{ message | Filter}} 二. Vue自带的过滤器:capitalize 功能:首字母大写 <!DOCTYPE html> ...
随机推荐
- DIV水平垂直居中的CSS兼容写法
DIV水平垂直居中,非IE浏览器可以用CSS3来处理,IE浏览器中分别处理IE6和/IE7.IE8.IE9. 在IE低版本中,虽然大致上没有问题,但还是有一些细微的显示问题. 示例如下: <!D ...
- Ubuntu通过xinput禁用及启用联想笔记本的触摸板
查看设备列表 通过xinput先查看一些都有哪些设备 xinput #或者 xinput list 显示结果如下 ddd@ddd:~$ xinput list Virtual core p ...
- pL/SQL 创建DBLIKN
某些时候,需要关联不同的数据库进行数据查询.操作等. 在Oracle中,关联不同的数据库进行表关联,就要用到了数据库连接(DB link). 创建DB link有两种方法:通过SQL语句创建,通过可视 ...
- 从Linux服务器下载文件到本地
通过安装xshell,连接服务器,通过以下命令可以方便的将服务器的文件下载到本地 #下载一个文件 sz filename #下载多个文件 sz filename1 filename2 #下载dir目录 ...
- Hashtable语法简介
Hashtable简述 Hashtable是System.Collections命名空间提供的一个容器 Hashtable中keyvalue键值对均为object类型,所以Hashtable可以支持任 ...
- Jquery-ajax()方法提交json数据
1.ajax()提交json数据代码 var strJson = getStrPayJson(); $.ajax({ type: "POST", url: "/userc ...
- kafka基本机制
Kafka目前主要作为一个分布式的发布订阅式的消息系统使用,下面简单介绍一下kafka的基本机制 1.3.1 消息传输流程 Producer即生产者,向Kafka集群发送消息,在发送消息之前,会对消息 ...
- python数据类型(数字\字符串\列表)
一.基本数据类型——数字 1.布尔型 bool型只有两个值:True和False 之所以将bool值归类为数字,是因为我们也习惯用1表示True,0表示False. (1)布尔值是False的各种情况 ...
- vue+rest-framework前后端分离整合（二）
一.基于api前端显示课程详细信息 1.调整Course.vue模块 <template> <div> <h1>课程列表</h1> <div v- ...
- 软件项目技术点(2)——Canvas之坐标系转换
AxeSlide软件项目梳理 canvas绘图系列知识点整理 默认坐标系与当前坐标系 canvas中的坐标是从左上角开始的,x轴沿着水平方向(按像素)向右延伸,y轴沿垂直方向向下延伸.左上角坐标为 ...