ionic准备之angular基础——格式化数据以及过滤器（8）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body ng-app="myApp">
<div ng-controller="firstController">
{{name | uppercase}} <!--转换大写-->
<br> {{name1 | lowercase }} <!--转换小写--> <br>
{{time | date:"yyyy-MM-dd hh:mm:ss" }} <br>
{{120 | currency}} <!--美元格式化-->
{{120 | currency:"￥"}} <!--中文格式化--> <br>
{{123123123 | number }} <!--格式化数字-->
<br>
{{1.23123123 | number:"1" }} <!--保留小数点--> <br>
{{[{name:"tanxu",age:11},{name:"张三",age:21},{name:"李四",age:31}] | filter:{name:"张三"} }} <!--filter过滤--> <br>
{{"我是一个中国人" | limitTo:2 }} <!--litmitTo截取多少位数-->
{{"huahuusdf" | limitTo:-2 }} <!--从后面向前面截取2位--> <br>
{{[{name:"tanxu",age:31},{name:"张三",age:21},{name:"李四",age:11}] | orderBy :'age'}} <!--对age进行排序--> <!--自定义过滤器的使用-->
<br>
{{"hi,tanxu" | myFilter:0:2 }} <!--传入多个参数--> <!--引入外部的模块定义的过滤器,,先引入js文件，再加模块依赖-->
<br>
{{"hi,中国" | myFilter1:0:5 }}
</div>
</body>
<script src="angular/angular.js"></script>
<script src="filter.js"></script>
<script type="text/javascript">
var app=angular.module("myApp",['filterModule']); app.controller('firstController',function($scope,$filter){
$scope.name="tanxu"; $scope.name1="TANXU"; $scope.time="1234234234"; $scope.name3=$filter('uppercase')($scope.name); /*利用js的方式去过滤 ，注意：需要注入$filter服务才可以用*/
console.log($scope.name3); }); /*自定义过滤器---注意：在module中定义*/
app.filter('myFilter',function(){
return function(input,n1,n2){
return input.replace(/hi/,"你好").substring(n1,n2); /*定义一个自定义的过滤器，实现向替换hi为你好，接着截取n1-n2的字符串进行返回*/
}
}) </script>
</html>
在另一个过滤器模块中存放自定义过滤器
/**
* Created by Administrator on 2016/3/28.
*/
/*将各种过滤器定义为一个模块*/
var filter=angular.module('filterModule',[]); filter.filter('myFilter1',function(){
return function(input,n1,n2){
return input.replace(/hi/,"你好").substring(n1,n2); /*定义一个自定义的过滤器，实现向替换hi为你好，接着截取n1-n2的字符串进行返回*/
}
})
ionic准备之angular基础——格式化数据以及过滤器（8）的更多相关文章
- ionic准备之angular基础——dom操作相关（6）
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ionic准备之angular基础———服务provider 和 factory和service（9）
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ionic准备之angular基础——模板引入（7）
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ionic准备之angular基础——$watch,$apply,$timeout方法（5）
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ionic准备之angular基础——run方法（4）
可以看到整个angular.module对象具有以下各种属性和方法 <!DOCTYPE html> <html lang="en"> <head> ...
- ionic准备之angular基础——继承（3）
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 第214天:Angular 基础概念
一.Angular 简介 1. 什么是 AngularJS - 一款非常优秀的前端高级 JS 框架 - 最早由 Misko Hevery 等人创建 - 2009 年被 Google 公式收购,用于其多 ...
- Angular.js之内置过滤器学习笔记
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- Angular基础---->AngularJS的使用(一)
AngularJS主要用于构建单页面的Web应用.它通过增加开发人员和常见Web应用开发任务之间的抽象级别,使构建交互式的现代Web应用变得更加简单.今天,我们就开始Angular环境的搭建和第一个实 ...
随机推荐
- CodeVs1515 跳
题目描述 Description 邪教喜欢在各种各样空间内跳. 现在,邪教来到了一个二维平面.在这个平面内,如果邪教当前跳到了(x,y),那么他下一步可以选择跳到以下4个点:(x-1,y), (x+1 ...
- Java中Collections的binarySearch方法
方法一 public static <T> int binarySearch(List<? extends Comparable<? super T>> list, ...
- popen的用法及与system调用的区别
首先用man查看下popen的介绍: popen(3) - Linux man page Name popen, pclose - pipe stream to or from a process S ...
- 3.sql
from odps import ODPS o = ODPS(access_id="LTASVb3aOF3ghjek", secret_access_key="FeUoz ...
- 【linux高级程序设计】（第十章）Linux异步信号处理机制 3
信号屏蔽 信号忽略:系统仍然传递该信号,只是相应的进程不做任何处理 信号屏蔽:进程不捕获信号,信号处于未决状态,当不再屏蔽信号时可以捕获之前被屏蔽的信号. 信号集数据结构定义: typedef __s ...
- VS2010安装包制作
最近对软件安装包制作研究了一下,下面记录了一种比较简单,不用写代码的方法. 1.New Project---->Other Project Types ---->Visual Studio ...
- selenium IE自动化问题汇总
驱动下载:http://selenium-release.storage.googleapis.com/index.html 没有修改IE的保护模式设置导致,通常看到报错信息如下: selenium. ...
- laravel 安装碰到的问题：全局安装 Laravel Installer，然后用下面的指令创建新项目： laravel new blog报连接超时解决方案
在执行laravel new project 的时候报错 cURL error 7: Failed to connect to cabinet.laravel.com port 80: Timed o ...
- 天梯L2-003-测试点
测试点3无法过,题目说是正整数用了int,结果得用double输入才能AC.
- （3）WPF 布局
一.布局原则 二.布局过程 三.布局容器 核心布局面板 布局属性