angularJS过滤器+自定义
angularJS过滤器
1、uppercase，lowercase 大小写转换
{{ "lower cap string" | uppercase }} // 结果：LOWER CAP STRING {{ "TANK is GOOD" | lowercase }} // 结果：tank is good
2、date 格式化
{{1490161945000 | date:"yyyy-MM-dd HH:mm:ss"}} // 2017-03-22 13:52:25
3、number 格式化（保留小数）
{{149016.1945000 | number:2}}
4、currency货币格式化
{{ 250 | currency }} // 结果：$250.00 {{ 250 | currency:"RMB ￥ " }} // 结果：RMB ￥ 250.00
5、filter查找
输入过滤器可以通过一个管道字符（|）和一个过滤器添加到指令中，该过滤器后跟一个冒号和一个模型名称。
filter 过滤器从数组中选择一个子集
// 查找name为iphone的行 {{ [{"age": 20,"id": 10,"name": "iphone"}, {"age": 12,"id": 11,"name": "sunm xing"}, {"age": 44,"id": 12,"name": "test abc"} ] | filter:{'name':'iphone'} }}
6、limitTo 截取
{{"1234567890" | limitTo :6}} // 从前面开始截取6位 {{"1234567890" | limitTo:-4}} // 从后面开始截取4位
7、orderBy 排序
// 根id降序排 {{ [{"age": 20,"id": 10,"name": "iphone"}, {"age": 12,"id": 11,"name": "sunm xing"}, {"age": 44,"id": 12,"name": "test abc"} ] | orderBy:'id':true }} // 根据id升序排 {{ [{"age": 20,"id": 10,"name": "iphone"}, {"age": 12,"id": 11,"name": "sunm xing"}, {"age": 44,"id": 12,"name": "test abc"} ] | orderBy:'id' }}
自定义
过滤器结构
{{带过滤数据 | 过滤器名：参数1：参数2：参数3.....}}
app.filter('过滤器名', function () {
return function (待过滤数据, 参数....) {
......
return 已过滤数据;
}<span class="hlxny-xbfx-span" ng-bind="x.jxReason | hyJXReason" ></span>
hyMui.launcherNavi({
displayUrl: 'pagesV2/launcherNavi/launcherNavi.html'
});
var app = hyMui.bootstrap('app', ['onsen', 'haiyiMobile'], {debug: false,launcherLogin:true});
app.filter('hydate', ['$filter', function ($filter) {
return function (input, format) {
if (!input || input.length <= 0) {
input = new Date();
} else {
var dateParse = Date.parse(input.toString().replace(/\-/g, '\/'));
if (isNaN(dateParse))
input = new Date();
else
input = new Date(dateParse);
}
var date = $filter('date')(input, format);
return date;
};
}]);
app.filter('hyJXReason', ['$filter', function ($filter) {
return function (item, format) {
if (!item || item.length <= 0) {
return;
}
if(item == "A" ){
return "雷击";
}else if(item == "B"){
return "外力破坏";
}else if(item == "C"){
return "自然灾害";
}else if(item == "D"){
return "特殊气象";
}else if(item == "E"){
return "污闪";
}else if(item == "F"){
return "小动物";
}else if(item == "G"){
return "设备老化";
}else if(item == "H"){
return "被盗";
}else if(item == "I"){
return "产品质量";
}else if(item == "J"){
return "施工质量";
}else if(item == "K"){
return "过载";
}else if(item == "L"){
return "设计不当";
}else if(item == "M"){
return "操作不当";
}else if(item == "N"){
return "用户设备故障引起";
}else if(item == "O"){
return "保护误动拒动";
}else if(item == "P"){
return "其他";
}else if(item == "Q"){
return "原因不明";
}
};
}]);
app.filter('cutStr', ['$filter', function ($filter) {
return function (input) {
if (!input)
return '';
if (input.length <= 8)
return input;
var arr = input.split("-");
var temp = arr[0];
var tail = arr[1];
input = temp.substr((temp.length - 8), temp.length);
//
//去掉后8位的前面0位
if (input == "000000000") {
return "0" + "-" + tail;
}
input = input.replace(/\b(0+)/gi, "");
return "充电枪" + input + "-" + tail;
};
}]);
app.filter('socialDate', ['$filter', function ($filter) {
return function (input, format) {
if (!input || input.length <= 0)
return '';
var inputDate = new Date(Date.parse(input.toString().replace(/\-/g, '\/')));
if (!inputDate.getFullYear())
inputDate = new Date(Date.parse(input.toString()));
var date = new Date();
if ('yyyy' == format) {
var year = date.getFullYear();
var inputYear = inputDate.getFullYear();
switch (year - inputYear) {
case 0:
return '今年';
case 1:
return '去年';
case -1:
return '明年';
default:
return inputYear + '年';
}
} else if ('MM' == format) {
var year = date.getFullYear();
var inputYear = inputDate.getFullYear();
var month = date.getMonth();
var inputMonth = inputDate.getMonth();
if (year != inputYear)
return (inputMonth + 1) + '月';
switch (month - inputMonth) {
case 0:
return '本月';
default:
return (inputMonth + 1) + '月';
}
} else if ('dd' == format) {
var year = date.getFullYear();
var inputYear = inputDate.getFullYear();
var month = date.getMonth();
var inputMonth = inputDate.getMonth();
var day = date.getDate();
var inputDay = inputDate.getDate();
if (year == inputYear && month == inputMonth) {
switch (day - inputDay) {
case 0:
return '今天';
case 1:
return '昨天';
case 2:
return '前天';
case -1:
return '明天';
default:
return inputDay + '日';
}
} else {
return inputDay + '日';
}
}
return input;
}
}]);
/**
* 手机号中间四位显示
*
*/
app.filter('showMobileFiter', ['$filter', function ($filter) {
return function (mobile) {
if (typeof mobile == 'undefined') {
return '****';
}
return mobile.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2');
};
}]);
/**
*日期格式化，显示年月日
*/
app.filter('formatStrDate', ['$filter', function ($filter) {
return function (input) {
var date = new Date(input);
var formatDate = date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate();
return formatDate;
};
}]);
/**
*充电站详细，显示电压
* 1 200-500V
* 2 250-750V
* 3 其他
*/
app.filter('volFilter', ['$filter', function ($filter) {
return function (input) {
if (null == input || '' == input) {
return '其他';
}
if (1 == input || '1' == input || parseInt(input) == 1) {
return '200-500V';
}
if (2 == input || '2' == input || parseInt(input) == 2) {
return '250-700V';
}
if (3 == input || '3' == input || parseInt(input) == 3) {
return '220/380V';
}
if (4 == input || '4' == input || parseInt(input) == 4) {
return '其他';
}
return '200-500V';
};
}]);
/**
* 格式化数字，显示小数点后两位
*/
app.filter('formatNumber', ['$filter', function ($filter) {
return function (number) {
var newPar = /^(-|\+)?\d+(\.\d+)?$/;
if (newPar.test(number)) {
var s = number.toString().split('.');
if (s.length == 1)
return s + '.00';
if (s.length > 1) {
var a = s[0];
var b = s[1];
if (b.length < 2)
return a + '.' + b + '0';
if (b.length < 3)
return number;
else
return a + '.' + b.substr(0, 2);
}
}
}
}]);