详解angular ui-grid之过滤器设置


Posted in Javascript onJune 07, 2017

之前关于angular ui-grid过滤器设置,最近需要回顾,就顺便发到随笔上了

var app = angular.module('app', ['ui.grid', 'ui.grid.edit']); 
 
app.controller('MainCtrl', ['$scope', '$http', function ($scope, $http) { 
 $scope.gridOptions = { 
  columnDefs: [ 
   { field: 'name' }, 
   { field: 'amount', name: 'Number', cellFilter: 'fractionFilter' }, 
   { field: 'amount', name: 'Currency', cellFilter: 'currencyFilter:this' } 
  ] 
 }; 
  
 $http.get('data.json') 
 .success(function (data) { 
  $scope.gridOptions.data = data; 
 }); 
}]) 
 
.filter('fractionFilter', function () { 
 return function (value) { 
  return value.toFixed(0); 
 }; 
}) 
 
.filter('currencyFilter', function () { 
 var currencyMap = { 
  'dollar': '$', 
  'pound': '£', 
  'euro': '?' 
 }; 
  
 return function (value, scope) { 
  return currencyMap[scope.row.entity.currency] + value.toFixed(2); 
 }; 
})

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JQuery.closest(),parent(),parents()寻找父结点
Feb 17 Javascript
Javascript创建自定义对象 创建Object实例添加属性和方法
Jun 04 Javascript
jQuery的内容过滤选择器学习教程
Apr 18 Javascript
jQuery使用经验小技巧(推荐)
May 31 Javascript
AngularJS 路由详解和简单实例
Jul 28 Javascript
Angular下H5上传图片的方法(可多张上传)
Jan 09 Javascript
js编写选项卡效果
May 23 Javascript
AngularJS中scope的绑定策略实例分析
Oct 30 Javascript
让bootstrap的carousel支持滑动滚屏的实现代码
Nov 27 Javascript
vue 音乐App QQ音乐搜索列表最新接口跨域设置方法
Sep 25 Javascript
DatePickerDialog 自定义样式及使用全解
Jul 09 Javascript
前端性能优化建议
Sep 17 Javascript
微信小程序 地图map实例详解
Jun 07 #Javascript
微信小程序 http请求的session管理
Jun 07 #Javascript
Ionic2开发环境搭建教程
Aug 20 #Javascript
微信小程序Redux绑定实例详解
Jun 07 #Javascript
Ionic3 UI组件之Gallery Modal详解
Jun 07 #Javascript
vue2.0 中#$emit,$on的使用详解
Jun 07 #Javascript
vue2.0 自定义日期时间过滤器
Jun 07 #Javascript
You might like
优化NFR之一 --MSSQL Hello Buffer Overflow
2006/10/09 PHP
PHP设计模式之工厂模式与单例模式
2016/09/28 PHP
Zend Framework校验器Zend_Validate用法详解
2016/12/09 PHP
php单元测试phpunit入门实例教程
2017/11/17 PHP
PHP7 list() 函数修改
2021/03/09 PHP
Using the TextRange Object
2006/10/14 Javascript
Node.js中的缓冲与流模块详细介绍
2015/02/11 Javascript
jquery实现页面百叶窗走马灯式翻滚显示效果的方法
2015/03/12 Javascript
jQuery实现ToolTip元素定位显示功能示例
2016/11/23 Javascript
微信小程序 地图map详解及简单实例
2017/01/10 Javascript
原生JS实现圆环拖拽效果
2017/04/07 Javascript
javascript实现动态显示颜色块的报表效果
2017/04/10 Javascript
Vue通过ref父子组件拿值方法
2018/09/12 Javascript
Node.js模拟发起http请求从异步转同步的5种用法
2018/09/26 Javascript
微信 jssdk 签名错误invalid signature的解决方法
2019/01/14 Javascript
Node.js+Express+Mysql 实现增删改查
2019/04/03 Javascript
nodejs语言实现验证码生成功能的示例代码
2019/10/13 NodeJs
Vue中使用better-scroll实现轮播图组件
2020/03/07 Javascript
在Python的Django框架上部署ORM库的教程
2015/04/20 Python
Python RuntimeError: thread.__init__() not called解决方法
2015/04/28 Python
Python ftp上传文件
2016/02/13 Python
Python中运算符"=="和"is"的详解
2016/10/08 Python
python 写入csv乱码问题解决方法
2016/10/23 Python
解决pyqt中ui编译成窗体.py中文乱码的问题
2016/12/23 Python
python利用lxml读写xml格式的文件
2017/08/10 Python
python实现画圆功能
2018/01/25 Python
python 字典的打印实现
2019/09/26 Python
Python进程间通信multiprocess代码实例
2020/03/18 Python
Python用dilb提取照片上人脸的示例
2020/10/26 Python
如何防止同一个帐户被多人同时登录
2013/08/01 面试题
酒店总经理助理职责
2014/02/12 职场文书
小学班干部竞选演讲稿
2014/04/24 职场文书
网站创业计划书
2014/04/30 职场文书
商场广播稿范文
2015/08/19 职场文书
为什么MySQL 删除表数据 磁盘空间还一直被占用
2021/10/16 MySQL
分享一个vue实现的记事本功能案例
2022/04/11 Vue.js