angularJS自定义 过滤器基础
先写个简单的例子,该过滤器是指定规定的字符串长度:
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自定义 过滤器基础的更多相关文章
- 创建 AngularJS 自定义过滤器,带自定义参数
Angularjs过滤器是 angularjs非常棒的特性之一.有朝一日,你可能需要使用自定义过滤器,幸运的是,你找到了这篇博文. 下面显示的是自定义过滤器长什么样子(请注意myfilter): &l ...
- angularJS自定义过滤器、服务和指令
自定义过滤器 mainApp.filter('mayfilter',function(){ return function(input){ (过滤逻辑代码) } }); 自定义创建指令 mainA ...
- AngularJs自定义过滤器filter
AngularJs自带有很多过滤器,现在Insus.NET演示一个自定义的过滤器,如实现一个数据的平方. 本演示是在ASP.NET MVC环境中进行. 创建一个app: 创建一个控制器: 接下来是重点 ...
- angularjs自定义过滤器
实现一个按输入框中的数据筛选的功能,筛选可按电影的名称.年份.评分检索框: <input type="text" placeholder="可检索名字评分和年份&q ...
- AngularJs filter 过滤器基础【转】
Filter Ng里的过滤器. currency:把一个数字格式化成货币模式(如$1,234.56).当没有提供任何货币符号时,默认使用当前区域的符号. 使用: HTML:{{ currency_ex ...
- 关于angularjs 中自定义过滤器
包子认为,在angularjs中,经常需要用到自定义过滤器,来过滤相应的功能,自定义过滤器非常的简单,我就直接贴代码啦 其中input就是你需要进行操作的对象,,,用法就直接就是 是不是很easy.. ...
- AngularJs练习Demo8 自定义过滤器
@{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name="viewport&quo ...
- AngularJS实现的自定义过滤器简单示例
本文实例讲述了AngularJS实现的自定义过滤器.分享给大家供大家参考,具体如下: 1.自定义限制字数的过滤器 啥也不说了直接上代码吧 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 ...
- AngularJS中自定义过滤器
AngularJS中为我们提供了一些内置的过滤器,这里列举一些自定义过滤器的场景. 自定义过滤器,不带参赛 //过滤 不带参赛 app.filter('ordinal', function () { ...
随机推荐
- iOS_23_undress Girl
最后效果图: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvcHJlX2VtaW5lbnQ=/font/5a6L5L2T/fontsize/400/fill ...
- sql 中如何取出指定行: Row_Number
原文:sql 中如何取出指定行: Row_Number ROW_NUMBER (Transact-SQL) USE AdventureWorks2008R2;GOWITH OrderedOrders ...
- Gimp教程:制作彩色的网站横幅
效果图: Step1.新建900x200的透明图层 Step2.点选画笔工具,在左下方的设置界面进行如下: 设置画笔,动态,颜色,勾选应用抖动,然后试着在图层上画一画,调节一下画笔大小,相信你能作出如 ...
- leetcode第七题--Reverse Integer
Problem: Reverse digits of an integer. Example1: x = 123, return 321Example2: x = -123, return -321 ...
- serialVersionUID行动
ORIGINAL:未知 Java断类的serialVersionUID来验证版本号一致性的.在进行反序列化时,JVM会把传来的字节流中的serialVersionUID与本地对应实体(类)的seria ...
- 我的Android 4 学习系列之开始入手:配置开发环境与理解Hello World!
目录 如何安装Android SDK.创建开发环境和调试项目 移动设计中一些注意事项 使用Android虚拟设备.模拟器和其他开发工具 如何安装Android SDK.创建开发环境和调试项目 下载和安 ...
- 【转】android json解析及简单例子
JSON的定义: 一种轻量级的数据交换格式,具有良好的可读和便于快速编写的特性.业内主流技术为其提供了完整的解决方案(有点类似于正则表达式 ,获得了当今大部分语言的支持),从而可以在不同平台间进行数据 ...
- Ibatis.Net执行Sql超时commandTimeout的一个坑
项目中使用了Ibatis.Net,数据库是Mysql,在做一个批量Update的操作时,需要执行40几秒,在执行到30秒的时候,会抛出异常:Timeout expired , The timeout ...
- 你是否听过 TypeScript?
Type入门(JavaScript的超集)-译 你是否听过 TypeScript? TypeScript 是 JavaScript 的超集,TypeScript结合了类型检查和静态分析,显式接口. ...
- WinDbg 命令手册
WinDbg 命令三部曲:(一)WinDbg 命令手册 本文为 Dennis Gao 原创技术文章,发表于博客园博客,未经作者本人允许禁止任何形式的转载. 系列博文 <WinDbg 命令三部 ...