Permalink
Comparing changes
Open a pull request
- 2 commits
- 2 files changed
- 0 commit comments
- 1 contributor
Commits on Oct 11, 2016
…history.back This reverts commit c49fb56. There was a regression in angular-material that relied upon the input directive having `link.pre` property
…ory.back
Due to the nature of some browser's PageCache/BFCache, returning to an Angular
app sometimes causes `input[hidden]` elements to retain the last value
that was stored before the page was navigated away from previously.
This is particularly problematic if the input has an interpolated value.
E.g. `<input type="hidden" value="{{ 1 + 2 }}">` since when the browser
returns, instead of the original interpolation template, the HTML contains
the previous value `<input type="hidden" value="3">`.
This commit instructs the browser not to attempt to reinstate the previous
value when navigating back in history by setting `autocomplete="off"` on
the hidden input element element.
Unified
Split
Showing
with
17 additions
and 10 deletions.
- +11 −1 src/ng/compile.js
- +6 −9 src/ng/directive/input.js
| @@ -2085,13 +2085,17 @@ function $CompileProvider($provide, $$sanitizeUriProvider) { | ||
| var nodeType = node.nodeType, | ||
| attrsMap = attrs.$attr, | ||
| match, | ||
| nodeName, | ||
| className; | ||
|
|
||
| switch (nodeType) { | ||
| case NODE_TYPE_ELEMENT: /* Element */ | ||
|
|
||
| nodeName = nodeName_(node); | ||
|
|
||
| // use the node name: <directive> | ||
| addDirective(directives, | ||
| directiveNormalize(nodeName_(node)), 'E', maxPriority, ignoreDirective); | ||
| directiveNormalize(nodeName), 'E', maxPriority, ignoreDirective); | ||
|
|
||
| // iterate over the attributes | ||
| for (var attr, name, nName, ngAttrName, value, isNgAttr, nAttrs = node.attributes, | ||
| @@ -2133,6 +2137,12 @@ function $CompileProvider($provide, $$sanitizeUriProvider) { | ||
| attrEndName); | ||
| } | ||
|
|
||
| if (nodeName === 'input' && node.getAttribute('type') === 'hidden') { | ||
| // Hidden input elements can have strange behaviour when navigating back to the page | ||
| // This tells the browser not to try to cache and reinstate previous values | ||
| node.setAttribute('autocomplete', 'off'); | ||
| } | ||
|
|
||
| // use class as directive | ||
| if (!cssClassDirectivesEnabled) break; | ||
| className = node.className; | ||
| @@ -1992,20 +1992,17 @@ var inputDirective = ['$browser', '$sniffer', '$filter', '$parse', | ||
| return { | ||
| restrict: 'E', | ||
| require: ['?ngModel'], | ||
| compile: function(tElement, tAttr) { | ||
| if (lowercase(tAttr.type) === 'hidden') tAttr.$set('autocomplete', 'off'); | ||
| return { | ||
| pre: function(scope, element, attr, ctrls) { | ||
| if (ctrls[0]) { | ||
| link: { | ||
| pre: function(scope, element, attr, ctrls) { | ||
| if (ctrls[0]) { | ||
| var type = lowercase(attr.type); | ||
| if ((type === 'range') && !attr.hasOwnProperty('ngInputRange')) { | ||
| type = 'text'; | ||
| } | ||
| (inputType[type] || inputType.text)(scope, element, attr, ctrls[0], $sniffer, | ||
| $browser, $filter, $parse); | ||
| } | ||
| (inputType[type] || inputType.text)(scope, element, attr, ctrls[0], $sniffer, | ||
| $browser, $filter, $parse); | ||
| } | ||
| }; | ||
| } | ||
| } | ||
| }; | ||
| }]; | ||