Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

fix(ngValue): set value property instead of attribute #14023

Closed
wants to merge 1 commit into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions src/.jshintrc
Original file line number Diff line number Diff line change
Expand Up @@ -140,6 +140,7 @@
"jqLiteParseHTML": false,
"jqLiteWrapNode": false,
"getBooleanAttrName": false,
"getValueAttrName": false,
"getAliasedAttrName": false,
"createEventHandler": false,
"JQLitePrototype": false,
Expand Down
18 changes: 18 additions & 0 deletions src/jqLite.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@
addEventListenerFn: true,
removeEventListenerFn: true,
BOOLEAN_ATTR: true,
VALUE_ATTR: true,
ALIASED_ATTR: true,
*/

Expand Down Expand Up @@ -577,6 +578,15 @@ var BOOLEAN_ELEMENTS = {};
forEach('input,select,option,textarea,button,form,details'.split(','), function(value) {
BOOLEAN_ELEMENTS[value] = true;
});

var VALUE_ATTR = {};
VALUE_ATTR['value'] = 'value';

var VALUE_ELEMENTS = {};
forEach('input,textarea'.split(','), function(value) {
VALUE_ELEMENTS[value] = true;
});

var ALIASED_ATTR = {
'ngMinlength': 'minlength',
'ngMaxlength': 'maxlength',
Expand All @@ -593,6 +603,14 @@ function getBooleanAttrName(element, name) {
return booleanAttr && BOOLEAN_ELEMENTS[nodeName_(element)] && booleanAttr;
}

function getValueAttrName(element, name) {
// check dom last since we will most likely fail on name
var valueAttr = VALUE_ATTR[name.toLowerCase()];

// booleanAttr is here twice to minimize DOM access
return valueAttr && VALUE_ELEMENTS[nodeName_(element)] && valueAttr;
}

function getAliasedAttrName(name) {
return ALIASED_ATTR[name];
}
Expand Down
5 changes: 3 additions & 2 deletions src/ng/compile.js
Original file line number Diff line number Diff line change
Expand Up @@ -1322,13 +1322,14 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {

var node = this.$$element[0],
booleanKey = getBooleanAttrName(node, key),
valueKey = getValueAttrName(node, key),
aliasedKey = getAliasedAttrName(key),
observer = key,
nodeName;

if (booleanKey) {
if (booleanKey || valueKey) {
this.$$element.prop(key, value);
attrName = booleanKey;
attrName = booleanKey ? booleanKey : valueKey;
} else if (aliasedKey) {
this[aliasedKey] = value;
observer = aliasedKey;
Expand Down
20 changes: 20 additions & 0 deletions test/ng/directive/inputSpec.js
Original file line number Diff line number Diff line change
Expand Up @@ -3046,6 +3046,26 @@ describe('input', function() {
expect(inputElm[0].getAttribute('value')).toBe('something');
});

it('should update the input "value" property and attribute after change the "value" property', function() {
var inputElm = helper.compileInput('<input type="text" ng-value="value">');

$rootScope.$apply(function() {
$rootScope.value = 'something';
});
expect(inputElm[0].value).toBe('something');
expect(inputElm[0].getAttribute('value')).toBe('something');

helper.changeInputValueTo('newValue');

$rootScope.$apply(function() {
$rootScope.value = 'anotherValue';
});
expect(inputElm[0].value).toBe('anotherValue');
expect(inputElm[0].getAttribute('value')).toBe('anotherValue');


});


it('should evaluate and set constant expressions', function() {
var inputElm = helper.compileInput('<input type="radio" ng-model="selected" ng-value="true">' +
Expand Down