先写个简单的例子,该过滤器是指定规定的字符串长度:

html:

<div ng-app="app" ng-controller="ctrl">
<p ng-repeat="text in texts>
{{book | limitText:10}}
</p>
</div>

js:

var app = angular.module("app",[]);
app.filter('limitText', function() {
return function(input, num) {
if(input.length>num){
input = input.substring(0,num)+"...";
}
return input;
};
});
app.controller("ctrl",["$scope",function($scope){
$scope.texts = ["大帅哥多发个梵蒂冈梵蒂冈","法规的非官","儿童热太热一天如图于一体"];
}]);

显示

大帅哥多发个梵蒂冈梵...

法规的非官

儿童热太热一天如图于...

自定义过滤器可以接受参数(可多个),也可以不用参数。

但参数必须写在return 后面函数的第二个参数里,第一个参数是要处理的对象。

多个参数的用法

{{ expression | filter:argument1:argument2:... }}

angularJS自定义 过滤器基础的更多相关文章

  1. 创建 AngularJS 自定义过滤器,带自定义参数

    Angularjs过滤器是 angularjs非常棒的特性之一.有朝一日,你可能需要使用自定义过滤器,幸运的是,你找到了这篇博文. 下面显示的是自定义过滤器长什么样子(请注意myfilter): &l ...

  2. angularJS自定义过滤器、服务和指令

    自定义过滤器 mainApp.filter('mayfilter',function(){ return function(input){ (过滤逻辑代码) } });   自定义创建指令 mainA ...

  3. AngularJs自定义过滤器filter

    AngularJs自带有很多过滤器,现在Insus.NET演示一个自定义的过滤器,如实现一个数据的平方. 本演示是在ASP.NET MVC环境中进行. 创建一个app: 创建一个控制器: 接下来是重点 ...

  4. angularjs自定义过滤器

    实现一个按输入框中的数据筛选的功能,筛选可按电影的名称.年份.评分检索框: <input type="text" placeholder="可检索名字评分和年份&q ...

  5. AngularJs filter 过滤器基础【转】

    Filter Ng里的过滤器. currency:把一个数字格式化成货币模式(如$1,234.56).当没有提供任何货币符号时,默认使用当前区域的符号. 使用: HTML:{{ currency_ex ...

  6. 关于angularjs 中自定义过滤器

    包子认为,在angularjs中,经常需要用到自定义过滤器,来过滤相应的功能,自定义过滤器非常的简单,我就直接贴代码啦 其中input就是你需要进行操作的对象,,,用法就直接就是 是不是很easy.. ...

  7. AngularJs练习Demo8 自定义过滤器

    @{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name="viewport&quo ...

  8. AngularJS实现的自定义过滤器简单示例

    本文实例讲述了AngularJS实现的自定义过滤器.分享给大家供大家参考,具体如下: 1.自定义限制字数的过滤器 啥也不说了直接上代码吧 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 ...

  9. AngularJS中自定义过滤器

    AngularJS中为我们提供了一些内置的过滤器,这里列举一些自定义过滤器的场景. 自定义过滤器,不带参赛 //过滤 不带参赛 app.filter('ordinal', function () { ...

随机推荐

  1. javascript7

    语句:条件,循环,跳转, 表达式语句,复合语句和空语句,声明语句,var,function,条件语句,switch,循环,标签语句,break语句,continue语句,return语句,throw语 ...

  2. Android设备连接Unity Profiler性能分析器

    Unity提供两种方式让Developer的Android设备连接Profiler进行性能分析: 1.通过wifi,Android设备和计算机处于同一个Wlan中. 2.通过USB ADB 普通情况我 ...

  3. Linux Telnet安装配置

    本文以红帽6.2 64位版本为例,其它linux类似: linux默认是使用SSH服务的 而不安装telnet服务 ,所以需要手动安装telnet. 1.telnet的安装包有两个,分别是: teln ...

  4. CentOS 7 结构体GCC 4.8.2 32位编译环境

    centos 7 结构体gcc 32位编译环境 1介绍 1.1背景 学习新 C++ 2011和C11标准. 1.2使用软件 CentOS 7(Linux version 3.10.0-123.el7. ...

  5. [译]Java 设计模式 之模板方法

    (文章翻译自Java Design Pattern: Template Method) 模板方法设计模式定义了归档特定操作的工作流.它允许子类去修改特定的步奏而不用改变工作流的结构. 下面的例子表示模 ...

  6. SQL Server 2005同步复制

    原文:SQL Server 2005同步复制 以下实现复制步骤(以快照复制为例) 运行平台SQL SERVER 2005 一.准备工作: 1.建立一个 WINDOWS 用户,设置为管理员权限,并设置密 ...

  7. 读书笔记—CLR via C#章节8-10

    前言 这本书这几年零零散散读过两三遍了,作为经典书籍,应该重复读反复读,既然我现在开始写博了,我也准备把以前觉得经典的好书重读细读一遍,并且将笔记整理到博客中,好记性不如烂笔头,同时也在写的过程中也可 ...

  8. 在C#中Color结构的各属性颜色对照表(转)

    转自:http://blog.sina.com.cn/s/blog_454dc49501016q2p.html Color.AliceBlue 240,248,255 Color.LightSalmo ...

  9. CSS绘制无图片的气泡对话框

    <div class="qipao_contianer">            <div class="qipao_content yj3" ...

  10. WCF的简单

    WCF的简单 WCF的学习之旅 一.WCF的简单介绍  Windows Communication Foundation(WCF)是由微软发展的一组数据通信的应用程序开发接口,可以翻译为Windows ...