angular学习笔记(十六) -- 过滤器(2)
本篇主要介绍angular自定义的过滤器:
直接看例子:
<!DOCTYPE html>
<html ng-app="MyFilter">
<head>
<title>13.2过滤器</title>
<meta charset="utf-8">
<script src="../angular.js"></script>
<script src="script.js"></script>
<style type="text/css">
*{
font-family:'MICROSOFT YAHEI';
font-size:12px
}
</style>
</head>
<body>
<div ng-controller="filter">
<span>{{title_1 | titleCase: 1 }}</span>
<br>
<span>{{title_2 | titleCase: 2 }}</span>
</div>
</body>
</html>
var myFilter = angular.module('MyFilter',[]);
myFilter.filter('titleCase',function(){
var titlecase = function(title,num){
var words = title.split(' ');
for(var i=0; i<words.length; i++){
words[i] = words[i].charAt(0).toUpperCase() + words[i].substring(1)
}
return num+'. '+words.join(' ')
};
return titlecase
});
myFilter.controller('filter',function($scope){
$scope.title_1 = 'i am code bunny !';
$scope.title_2 = 'i am white bunny !'
});
1. 首先要创建一个模块: MyFilter
2. 给模块添加一个过滤器: titleCase
创建过滤器的格式如下:
myFilter.filter('titleCase',function(){
var titlecase = function(title,num){
...
};
return titlecase
});
.filter的第一个参数为过滤器的名字,也就是在{{}}里面使用的名字,第二个参数是一个函数,函数需要再返回一个函数,被返回的函数,就是用来处理数据的函数,第一个参数就是需要被过滤的数据,后面的参数,就是在使用过滤器的时候,冒号后面传入的值. 比如这里的1:
<span>{{title_1 | titleCase: 1 }}</span>
3. 创建控制器: filter
4. 创建变量title_1,title_2
angular学习笔记(十六) -- 过滤器(2)的更多相关文章
- angular学习笔记(十六) -- 过滤器(1)
本篇主要介绍过滤器的基本用法: 过滤器用来对数据进行格式的转换,数据格式的转化与逻辑无关,因此,我们使用过滤器来进行这些操作: {{... | filter2: 参数1,参数2... }} expre ...
- python3.4学习笔记(十六) windows下面安装easy_install和pip教程
python3.4学习笔记(十六) windows下面安装easy_install和pip教程 easy_install和pip都是用来下载安装Python一个公共资源库PyPI的相关资源包的 首先安 ...
- (C/C++学习笔记) 十六. 预处理
十六. 预处理 ● 关键字typeof 作用: 为一个已有的数据类型起一个或多个别名(alias), 从而增加了代码的可读性. typedef known_type_name new_type_nam ...
- 【转】angular学习笔记(十四)-$watch(1)
本篇主要介绍$watch的基本概念: $watch是所有控制器的$scope中内置的方法: $scope.$watch(watchObj,watchCallback,ifDeep) watchObj: ...
- angular学习笔记(十四)-$watch(1)
本篇主要介绍$watch的基本概念: $watch是所有控制器的$scope中内置的方法: $scope.$watch(watchObj,watchCallback,ifDeep) watchObj: ...
- angular学习笔记(十五)-module里的'服务'
本篇介绍angular中的模块:module 在笔记(二)http://www.cnblogs.com/liulangmao/p/3711047.html里已经讲到过模块,这篇主要讲模块的 '服务' ...
- angular学习笔记(十九)-指令修改dom
本篇主要介绍angular使用指令修改DOM: 使用angular指令可以自己扩展html语法,还可以做很多自定义的事情.在后面会专门讲解这一块的知识,这一篇只是起到了解入门的作用. 与控制器,过滤器 ...
- python 学习笔记十六 django深入学习一 路由系统，模板，admin，数据库操作
django 请求流程图 django 路由系统 在django中我们可以通过定义urls,让不同的url路由到不同的处理函数 from . import views urlpatterns = [ ...
- angular学习笔记(十四)-$watch(3)
同样的例子,还可以这样写: <!DOCTYPE html> <html ng-app> <head> <title>11.3$watch监控数据变化&l ...
随机推荐
- 优化iOS程序性能的25个方法
1. 用ARC管理内存 ARC(Automatic ReferenceCounting, 自己主动引用计数)和iOS5一起公布.它避免了最常见的也就是常常是因为我们忘记释放内存所造成的内存泄露.它自己 ...
- python之模块csv之CSV文件的写入(基本结构)
# -*- coding: utf-8 -*- #python 27 #xiaodeng #CSV文件的写入(基本结构) import csv #csv文件,是一种常用的文本格式,用以存储表格数据,很 ...
- 30、java中递归算法
1.已知有一个数列f(0)=1,f(1)=4,f(n+2)=2*f(n+1)+f(n),其中n是大于0的正数,求f(10)的值. 分析:设x=n+2 => f(x)=2*f(n-1)+f(n-2 ...
- 实战：INNOBACKUPEX for mysql 5.6自己主动备份脚本
#backup.sh #!/bin/sh # # 第一次运行它的时候它会检查是否有全然备份,否则先创建一个全库备份 # 当你再次执行它的时候.它会依据脚本中的设定来基于之前的全库备份进行增量备份 #o ...
- 关于Xcode上的Other linker flags
Targets选项下有Other linker flags的设置,用来填写XCode的链接器参数,如:-ObjC -all_load -force_load等.还记得我们在学习C程序的时候,从C代码到 ...
- php计算经纬度间的距离
<?php //根据经纬度计算距离 function getdistance($lng1,$lat1,$lng2,$lat2) { //将角度转为狐度 $radLat1=deg2rad($lat ...
- Setting up a static IP address in Ubuntu
sudo gedit /etc/network/interfaces Change the line iface eth0 inet dhcp to iface eth0 inet static an ...
- eclipse svn登陆用户保存信息删除
win7系统 eclipse svn saveinfo path:磁盘:\%用户名%\AppData\Roaming\Subversion\auth\svn.simple 例如:D:\Users\用户 ...
- iOS - App 应用
1.Xcode 项目属性 Product Name 软件名称.产品名称.项目名称 Organization Name 公司名称.组织名称 Organization Identifier 公司的唯一标识 ...
- AP_应付模组在月结的处理
2014-06-04 Created By BaoXinjian 1. 完成所有交易及检查Interface (1). Invoice and Credits (2). Prepa ...