Skip to content

Commit

Permalink
fix: return null for empty number and percent fields
Browse files Browse the repository at this point in the history
Return null if the input of an ui-number-mask or
ui-percentage-mask field is empty instead of
returning undefined or an empty string.
This has the advantage, that no additional check is required for
null values inside of calculations (e.g. 5 + null === 5).
null is also a valid number, where as an empty string is not.
This is the same behavior as angular uses for input[number].
  • Loading branch information
Micha Reiser committed Nov 19, 2015
1 parent a93cf5a commit 510584e
Show file tree
Hide file tree
Showing 4 changed files with 31 additions and 3 deletions.
2 changes: 1 addition & 1 deletion src/global/number/number.js
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ function NumberMaskDirective($locale, $parse, PreFormatters, NumberMasks) {

function parser(value) {
if(ctrl.$isEmpty(value)) {
return value;
return null;
}

var valueToFormat = PreFormatters.clearDelimitersAndLeadingZeros(value) || '0';
Expand Down
16 changes: 15 additions & 1 deletion src/global/number/number.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,20 @@ describe('ui-number-mask', function() {
expect(model.$viewValue).toBe('3456.79');
});

it('should return null if field is empty', function () {
var input = TestUtil.compile('<input ng-model="model" ui-number-mask>', {
model: 1000
});

var model = input.controller('ngModel');
input.val('').triggerHandler('input');

expect(model.$viewValue).toBe('');
expect(model.$modelValue).toBeNull();
expect(model.$valid).toBe(true);

});

it('should validate minimum value', function() {
var input = TestUtil.compile('<input ng-model="model" ui-number-mask min="50">', {
model: '3456.79'
Expand Down Expand Up @@ -101,7 +115,7 @@ describe('ui-number-mask', function() {
{modelValue: '', viewValue: ''},
{modelValue: '0', viewValue: '0.00'},
{modelValue: '0.0', viewValue: '0.00'},
{modelValue: 0, viewValue: '0.00'},
{modelValue: 0, viewValue: '0.00'}
];

tests.forEach(function(test) {
Expand Down
2 changes: 1 addition & 1 deletion src/global/percentage/percentage.js
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ function PercentageMaskDirective($locale, $parse, PreFormatters, NumberMasks) {

function parse(value) {
if (ctrl.$isEmpty(value)) {
return value;
return null;
}

var valueToFormat = PreFormatters.clearDelimitersAndLeadingZeros(value) || '0';
Expand Down
14 changes: 14 additions & 0 deletions src/global/percentage/percentage.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,20 @@ describe('ui-percentage-mask', function() {
expect(model.$viewValue).toBe('1,234.50 %');
});

it('should return null if field is empty', function () {
var input = TestUtil.compile('<input ng-model="model" ui-percentage-mask>', {
model: 12.3
});

var model = input.controller('ngModel');
input.val('').triggerHandler('input');

expect(model.$viewValue).toBe('');
expect(model.$modelValue).toBeNull();
expect(model.$valid).toBe(true);

});

it('should hide thousands delimiter when ui-hide-group-sep is present', function() {
var input = TestUtil.compile('<input ng-model="model" ui-percentage-mask ui-hide-group-sep>', {
model: '12.345'
Expand Down

0 comments on commit 510584e

Please sign in to comment.