From 0a2df367a1f1b3abb04d1912f4626e5a7b368c6e Mon Sep 17 00:00:00 2001 From: Simon Sparks Date: Wed, 17 Jul 2013 10:53:06 +0100 Subject: [PATCH 1/3] angular/angular.js#1199 Suggested approach for supporting numerical true/false values in checkbox inputs. --- src/ng/directive/input.js | 14 +++++++++----- test/ng/directive/inputSpec.js | 27 ++++++++++++++++++++++++++- 2 files changed, 35 insertions(+), 6 deletions(-) diff --git a/src/ng/directive/input.js b/src/ng/directive/input.js index 2d3210d52649..18883ad4edbe 100644 --- a/src/ng/directive/input.js +++ b/src/ng/directive/input.js @@ -641,11 +641,8 @@ function radioInputType(scope, element, attr, ctrl) { } function checkboxInputType(scope, element, attr, ctrl) { - var trueValue = attr.ngTrueValue, - falseValue = attr.ngFalseValue; - - if (!isString(trueValue)) trueValue = true; - if (!isString(falseValue)) falseValue = false; + var trueValue = typedValue(attr.ngTrueValue, true), + falseValue = typedValue(attr.ngFalseValue, false); element.on('click', function() { scope.$apply(function() { @@ -666,6 +663,13 @@ function checkboxInputType(scope, element, attr, ctrl) { }); } +function typedValue(val, defaultVal) { + return isString(val) + ? !isNaN(parseFloat(val)) && isFinite(val) + ? parseFloat(val) + : val + : defaultVal; +} /** * @ngdoc directive diff --git a/test/ng/directive/inputSpec.js b/test/ng/directive/inputSpec.js index 36fb754d580c..ea28118e9f62 100644 --- a/test/ng/directive/inputSpec.js +++ b/test/ng/directive/inputSpec.js @@ -876,7 +876,7 @@ describe('input', function() { }); - it('should allow custom enumeration', function() { + it('should allow custom string enumeration', function() { compileInput(''); @@ -902,6 +902,31 @@ describe('input', function() { expect(scope.name).toEqual('n'); }); + it('should allow custom numerical enumeration', function() { + compileInput(''); + + scope.$apply(function() { + scope.name = 1; + }); + expect(inputElm[0].checked).toBe(true); + + scope.$apply(function() { + scope.name = 0; + }); + expect(inputElm[0].checked).toBe(false); + + scope.$apply(function() { + scope.name = 'something else'; + }); + expect(inputElm[0].checked).toBe(false); + + browserTrigger(inputElm, 'click'); + expect(scope.name).toEqual(1); + + browserTrigger(inputElm, 'click'); + expect(scope.name).toEqual(0); + }); it('should be required if false', function() { compileInput(''); From 34b0195447cb502daf555348843b763ccf182353 Mon Sep 17 00:00:00 2001 From: Simon Sparks Date: Wed, 17 Jul 2013 13:01:29 +0100 Subject: [PATCH 2/3] angular/angular.js#1199 documentation update to convey support for both string and number values in ngTrueValue and ngFalseValue attributes --- src/ng/directive/input.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/ng/directive/input.js b/src/ng/directive/input.js index 18883ad4edbe..07cc8cf442cc 100644 --- a/src/ng/directive/input.js +++ b/src/ng/directive/input.js @@ -340,8 +340,8 @@ var inputType = { * * @param {string} ngModel Assignable angular expression to data-bind to. * @param {string=} name Property name of the form under which the control is published. - * @param {string=} ngTrueValue The value to which the expression should be set when selected. - * @param {string=} ngFalseValue The value to which the expression should be set when not selected. + * @param {string=} ngTrueValue The string or number value to which the expression should be set when selected. + * @param {string=} ngFalseValue The string or number value to which the expression should be set when not selected. * @param {string=} ngChange Angular expression to be executed when input changes due to user * interaction with the input element. * From 89176a59d868838be4c032b66de290ad66200fe5 Mon Sep 17 00:00:00 2001 From: Simon Sparks Date: Wed, 17 Jul 2013 16:10:27 +0100 Subject: [PATCH 3/3] angular/angular.js#1199 number parsing performance improvement and addition of further unit test cases --- src/ng/directive/input.js | 13 +-- test/ng/directive/inputSpec.js | 146 ++++++++++++++++++++++++++++----- 2 files changed, 134 insertions(+), 25 deletions(-) diff --git a/src/ng/directive/input.js b/src/ng/directive/input.js index 07cc8cf442cc..9726d8c7dc48 100644 --- a/src/ng/directive/input.js +++ b/src/ng/directive/input.js @@ -663,12 +663,13 @@ function checkboxInputType(scope, element, attr, ctrl) { }); } -function typedValue(val, defaultVal) { - return isString(val) - ? !isNaN(parseFloat(val)) && isFinite(val) - ? parseFloat(val) - : val - : defaultVal; +function typedValue(value, defaultValue) { + if(isString(value)) { + var number = parseFloat(value); + return !isNaN(number) && isFinite(number) ? number : value; + } else { + return defaultValue; + } } /** diff --git a/test/ng/directive/inputSpec.js b/test/ng/directive/inputSpec.js index ea28118e9f62..209ac454ba42 100644 --- a/test/ng/directive/inputSpec.js +++ b/test/ng/directive/inputSpec.js @@ -876,33 +876,62 @@ describe('input', function() { }); - it('should allow custom string enumeration', function() { - compileInput(''); + describe('should allow custom string enumeration', function() { + it('with non empty strings', function() { + compileInput(''); - scope.$apply(function() { - scope.name = 'y'; - }); - expect(inputElm[0].checked).toBe(true); + scope.$apply(function() { + scope.name = 'y'; + }); + expect(inputElm[0].checked).toBe(true); - scope.$apply(function() { - scope.name = 'n'; - }); - expect(inputElm[0].checked).toBe(false); + scope.$apply(function() { + scope.name = 'n'; + }); + expect(inputElm[0].checked).toBe(false); - scope.$apply(function() { - scope.name = 'something else'; + scope.$apply(function() { + scope.name = 'something else'; + }); + expect(inputElm[0].checked).toBe(false); + + browserTrigger(inputElm, 'click'); + expect(scope.name).toEqual('y'); + + browserTrigger(inputElm, 'click'); + expect(scope.name).toEqual('n'); }); - expect(inputElm[0].checked).toBe(false); - browserTrigger(inputElm, 'click'); - expect(scope.name).toEqual('y'); + it('with empty strings', function() { + compileInput(''); - browserTrigger(inputElm, 'click'); - expect(scope.name).toEqual('n'); + scope.$apply(function() { + scope.name = 'something'; + }); + expect(inputElm[0].checked).toBe(true); + + scope.$apply(function() { + scope.name = ''; + }); + expect(inputElm[0].checked).toBe(false); + + scope.$apply(function() { + scope.name = 'something else'; + }); + expect(inputElm[0].checked).toBe(false); + + browserTrigger(inputElm, 'click'); + expect(scope.name).toEqual('something'); + + browserTrigger(inputElm, 'click'); + expect(scope.name).toEqual(''); + }); }); - it('should allow custom numerical enumeration', function() { + describe('should allow custom numerical enumeration', function() { + it('with positive numbers', function() { compileInput(''); @@ -928,6 +957,85 @@ describe('input', function() { expect(scope.name).toEqual(0); }); + it('with negative numbers', function() { + compileInput(''); + + scope.$apply(function() { + scope.name = -1; + }); + expect(inputElm[0].checked).toBe(true); + + scope.$apply(function() { + scope.name = 0; + }); + expect(inputElm[0].checked).toBe(false); + + scope.$apply(function() { + scope.name = 'something else'; + }); + expect(inputElm[0].checked).toBe(false); + + browserTrigger(inputElm, 'click'); + expect(scope.name).toEqual(-1); + + browserTrigger(inputElm, 'click'); + expect(scope.name).toEqual(0); + }); + + it('with floating point numbers', function() { + compileInput(''); + + scope.$apply(function() { + scope.name = 1.3; + }); + expect(inputElm[0].checked).toBe(true); + + scope.$apply(function() { + scope.name = -1.3; + }); + expect(inputElm[0].checked).toBe(false); + + scope.$apply(function() { + scope.name = 'something else'; + }); + expect(inputElm[0].checked).toBe(false); + + browserTrigger(inputElm, 'click'); + expect(scope.name).toEqual(1.3); + + browserTrigger(inputElm, 'click'); + expect(scope.name).toEqual(-1.3); + }); + + it('with exponential numbers', function() { + compileInput(''); + + scope.$apply(function() { + scope.name = 1e3; + }); + expect(inputElm[0].checked).toBe(true); + + scope.$apply(function() { + scope.name = 1e-3; + }); + expect(inputElm[0].checked).toBe(false); + + scope.$apply(function() { + scope.name = 'something else'; + }); + expect(inputElm[0].checked).toBe(false); + + browserTrigger(inputElm, 'click'); + expect(scope.name).toEqual(1e3); + + browserTrigger(inputElm, 'click'); + expect(scope.name).toEqual(1e-3); + }); + }); + it('should be required if false', function() { compileInput('');