diff --git a/README.md b/README.md index 801d43e4..b50855dc 100644 --- a/README.md +++ b/README.md @@ -192,6 +192,21 @@ Some masks are internationalized, so you need to include the proper angular-loca ```html ``` + +### ui-time-date ### +-Example: + +```html + +``` +- Support to the custom date masks (See moment.js date formats). +```html + +``` +- Support to ```parse``` attribute. When the attribute is set to ```false```, the inputed value will be passed to the model as a string. Default value of the attribute is ```true```. +```html + +``` ### More examples ### _See more usage examples in the [Demo page](http://assisrafael.github.io/angular-input-masks/)_ diff --git a/src/global/date/date.js b/src/global/date/date.js index 64513314..e4a7449e 100644 --- a/src/global/date/date.js +++ b/src/global/date/date.js @@ -20,6 +20,10 @@ function DateMaskDirective($locale) { restrict: 'A', require: 'ngModel', link: function(scope, element, attrs, ctrl) { + attrs.parse = attrs.parse || 'true'; + + dateFormat = attrs.uiDateMask || dateFormat; + var dateMask = new StringMask(dateFormat.replace(/[YMD]/g,'0')); function formatter(value) { @@ -52,7 +56,9 @@ function DateMaskDirective($locale) { ctrl.$render(); } - return moment(formatedValue, dateFormat).toDate(); + return attrs.parse === 'false' + ? formatedValue + : moment(formatedValue, dateFormat).toDate(); }); ctrl.$validators.date = function validator(modelValue, viewValue) { diff --git a/src/global/date/date.spec.js b/src/global/date/date.spec.js index 8b40d720..a27a8a39 100644 --- a/src/global/date/date.spec.js +++ b/src/global/date/date.spec.js @@ -27,13 +27,13 @@ describe('ui.utils.masks.date', function() { expect(input.getAttribute('value')).toEqual(formatedDateAsString); } - expect(value.getText()).toEqual(moment(formatedDateAsString, 'YYYY-MM-DD').toDate().toString()); + expect(value.evaluate('dateMask.toString()')).toEqual(moment(formatedDateAsString, 'YYYY-MM-DD').toDate().toString()); for (i = 7; i >= 0; i--) { input.sendKeys(protractor.Key.BACK_SPACE); numberToFormat = numberToFormat.slice(0, -1); if (numberToFormat) { - formatedDateAsString = dateFormatter.apply(numberToFormat).replace(/-$/,''); + formatedDateAsString = dateFormatter.apply(numberToFormat).replace(/-$/, ''); expect(input.getAttribute('value')).toEqual(formatedDateAsString); } } @@ -43,8 +43,8 @@ describe('ui.utils.masks.date', function() { var input = element(by.model('initializedDateMask')), value = element(by.exactBinding('initializedDateMask')); - value.getText().then((textValue) => { - var dateValue = moment(new Date(textValue)).format('YYYY-MM-DD'); + value.evaluate('initializedDateMask').then((initialValue) => { + var dateValue = moment(initialValue).format('YYYY-MM-DD'); expect(input.getAttribute('value')).toEqual(dateValue); }); }); @@ -108,7 +108,7 @@ describe('ui.utils.masks.date', function() { expect(input.getAttribute('value')).toEqual(formatedDateAsString); } - expect(value.getText()).toEqual(moment(formatedDateAsString, 'DD/MM/YYYY').toDate().toString()); + expect(value.evaluate('dateMask.toString()')).toEqual(moment(formatedDateAsString, 'DD/MM/YYYY').toDate().toString()); for (i = 7; i >= 0; i--) { input.sendKeys(protractor.Key.BACK_SPACE); @@ -124,8 +124,8 @@ describe('ui.utils.masks.date', function() { var input = element(by.model('initializedDateMask')), value = element(by.exactBinding('initializedDateMask')); - value.getText().then((textValue) => { - var dateValue = moment(new Date(textValue)).format('DD/MM/YYYY'); + value.evaluate('initializedDateMask').then((initialValue) => { + var dateValue = moment(initialValue).format('DD/MM/YYYY'); expect(input.getAttribute('value')).toEqual(dateValue); }); }); diff --git a/src/global/date/date.test.js b/src/global/date/date.test.js index 47d6ab44..5baebc9b 100644 --- a/src/global/date/date.test.js +++ b/src/global/date/date.test.js @@ -31,6 +31,15 @@ describe('ui-date-mask', function() { expect(model.$viewValue).toBe('1999-12-31'); }); + it('should use specified mask', function() { + var input = TestUtil.compile('', { + model: new Date('1999-12-31 00:00:00') + }); + + var model = input.controller('ngModel'); + expect(model.$viewValue).toBe('31.12.1999'); + }); + it('should ignore non digits', function() { var input = TestUtil.compile(''); var model = input.controller('ngModel'); @@ -50,6 +59,20 @@ describe('ui-date-mask', function() { }); }); + it('should parse input', angular.mock.inject(function($rootScope) { + var input = TestUtil.compile(''); + + input.val('1999-12-31').triggerHandler('input'); + expect($rootScope.model instanceof Date).toBe(true); + })); + + it('should not parse input when parse disabled', angular.mock.inject(function($rootScope) { + var input = TestUtil.compile(''); + + input.val('1999-12-31').triggerHandler('input'); + expect(typeof ($rootScope.model) === 'string').toBe(true); + })); + it('should handle corner cases', angular.mock.inject(function($rootScope) { var input = TestUtil.compile(''); var model = input.controller('ngModel');