I'm attempting to write a filter for use in a grid that will catch all null, undefined, blank string, or other similar values and display a dash "-". I've written the following so far, but it doesn't catch null values, and I'm wondering if it could be more succinct and possibly refactored to avoid three layers of nested if/else statements. Percentage values need to be checked that they're over 0 and under 1. Also, negative numbers and 0's should be returned as is. Thanks!
我正在尝试编写一个用于网格的过滤器,它将捕获所有null,undefined,空字符串或其他类似值,并显示短划线“ - ”。到目前为止,我已经编写了以下内容,但它没有捕获空值,我想知道它是否可以更简洁,并且可能重构以避免三层嵌套的if / else语句。需要检查百分比值是否超过0且低于1.此外,应按原样返回负数和0。谢谢!
angular.module('AdverseEventsExplorer.main').filter('emptyCellFilter', function ($filter) {
return function (input, cellFilter, args1, args2) {
if (cellFilter == undefined) {
return (angular.isNumber(input) || angular.isDefined(input) && input.length > 0) ? input : '-';
} else {
if (cellFilter.match(/pctg|percent|pctgFilter|incidence/ig)) {
return (input > 0 && input < 1.0000000) ? $filter(cellFilter)(input, args1, args2) : '-';
} else {
return (angular.isNumber(input) || angular.isDefined(input) && input.length > 0) ? input : '-';
}
}
};
});
Version 2.0 taking into account @tymeJV's comment:
版本2.0考虑到@ tymeJV的评论:
angular.module('AdverseEventsExplorer.main').filter('emptyCellFilter', function ($filter) {
return function (input, cellFilter, args1, args2) {
if (!cellFilter) {
return (angular.isNumber(input) || (input)) ? input : '-';
} else {
if (cellFilter.match(/pctg|percent|pctgFilter|incidence/ig)) {
return (input > 0 && input < 1.0000000) ? $filter(cellFilter)(input, args1, args2) : '-';
} else {
return (angular.isNumber(input) || (input)) ? $filter(cellFilter)(input, args1, args2) : '-';
}
}
};
});
2 个解决方案
#1
Whenever you encounter a function that's getting too complex to refactor try extracting some of the smaller statements to concisely named variables. It makes it much easier for our brains to keep track of the function's requirements, and it's also more readable to new devs reading your code.
每当遇到一个过于复杂而不能重构的函数时,请尝试将一些较小的语句提取到简洁的命名变量中。它使我们的大脑更容易跟踪函数的要求,并且对于阅读代码的新开发者来说,它也更具可读性。
var inputHasValue = angular.isNumber(input) || input;
if(!inputHasValue){
return '-';
}
if (!cellFilter) {
return input;
}
var isPercentageCell = cellFilter.match(/pctg|percent|pctgFilter|incidence/ig);
var valueIsInRange = input > 0 && input < 1;
if(!isPercentageCell || valueIsInRange){
return $filter(cellFilter)(input, args1, args2);
}
return '-';
#2
typeof x ==='number' || !!x
is false when x is null, undefined or empty string
当x为null,undefined或空字符串时,为false
Only one case in which it doesn't work – if you need to filter boolean variables, but your case doesn't seem to need it.
只有一种情况不起作用 - 如果你需要过滤布尔变量,但你的情况似乎并不需要它。
Anyway in that case you can use
无论如何,你可以使用
typeof x === 'boolean' || typeof x ==='number' || !!x
#1
Whenever you encounter a function that's getting too complex to refactor try extracting some of the smaller statements to concisely named variables. It makes it much easier for our brains to keep track of the function's requirements, and it's also more readable to new devs reading your code.
每当遇到一个过于复杂而不能重构的函数时,请尝试将一些较小的语句提取到简洁的命名变量中。它使我们的大脑更容易跟踪函数的要求,并且对于阅读代码的新开发者来说,它也更具可读性。
var inputHasValue = angular.isNumber(input) || input;
if(!inputHasValue){
return '-';
}
if (!cellFilter) {
return input;
}
var isPercentageCell = cellFilter.match(/pctg|percent|pctgFilter|incidence/ig);
var valueIsInRange = input > 0 && input < 1;
if(!isPercentageCell || valueIsInRange){
return $filter(cellFilter)(input, args1, args2);
}
return '-';
#2
typeof x ==='number' || !!x
is false when x is null, undefined or empty string
当x为null,undefined或空字符串时,为false
Only one case in which it doesn't work – if you need to filter boolean variables, but your case doesn't seem to need it.
只有一种情况不起作用 - 如果你需要过滤布尔变量,但你的情况似乎并不需要它。
Anyway in that case you can use
无论如何,你可以使用
typeof x === 'boolean' || typeof x ==='number' || !!x