diff options
| -rw-r--r-- | regression/issue-352.html | 13 | ||||
| -rw-r--r-- | src/markups.js | 53 | ||||
| -rw-r--r-- | src/widgets.js | 10 |
3 files changed, 75 insertions, 1 deletions
diff --git a/regression/issue-352.html b/regression/issue-352.html new file mode 100644 index 00000000..3f061e1b --- /dev/null +++ b/regression/issue-352.html @@ -0,0 +1,13 @@ +<!DOCTYPE HTML> +<html xmlns:ng="http://angularjs.org"> + <script type="text/javascript" src="../build/angular.js" ng:autobind></script> + <body ng:init="scope = { itemId: 12345 }"> + <input name="value" /><br /> + <a id="link-1" href ng:click="value = 1">link 1</a> (link, don't reload)<br /> + <a id="link-2" href="" ng:click="value = 2">link 2</a> (link, don't reload)<br /> + <a id="link-3" ng:href="#{{'123'}}" ng:click="value = 3">link 3</a> (link, reload!)<br /> + <a id="link-4" href="" name="xx" ng:click="value = 4">anchor</a> (link, don't reload)<br /> + <a id="link-5" name="xxx" ng:click="value = 5">anchor</a> (no link)<br /> + <a id="link-6" ng:href="#/{{value}}">link</a> (link, change hash) + </body> +</html> diff --git a/src/markups.js b/src/markups.js index 24de5c37..2a9b1c3e 100644 --- a/src/markups.js +++ b/src/markups.js @@ -105,6 +105,59 @@ angularTextMarkup('option', function(text, textNode, parentElement){ * * @element ANY * @param {template} template any string which can contain `{{}}` markup. + * + * @example + * This example uses `link` variable inside `href` attribute: + <doc:example> + <doc:source> + <input name="value" /><br /> + <a id="link-1" href ng:click="value = 1">link 1</a> (link, don't reload)<br /> + <a id="link-2" href="" ng:click="value = 2">link 2</a> (link, don't reload)<br /> + <a id="link-3" ng:href="#{{'123'}}" ng:click="value = 3">link 3</a> (link, reload!)<br /> + <a id="link-4" href="" name="xx" ng:click="value = 4">anchor</a> (link, don't reload)<br /> + <a id="link-5" name="xxx" ng:click="value = 5">anchor</a> (no link)<br /> + <a id="link-6" ng:href="#/{{value}}">link</a> (link, change hash) + </doc:source> + <doc:scenario> + it('should execute ng:click but not reload when href without value', function() { + element('#link-1').click(); + expect(element('input[name=value]').val()).toEqual('1'); + expect(element('#link-1').attr('href')).toBe(""); + }); + + it('should execute ng:click but not reload when href empty string', function() { + element('#link-2').click(); + expect(element('input[name=value]').val()).toEqual('2'); + expect(element('#link-2').attr('href')).toBe(""); + }); + + it('should execute ng:click and change url when ng:href specified', function() { + element('#link-3').click(); + expect(element('input[name=value]').val()).toEqual('3'); + expect(element('#link-3').attr('href')).toBe("#123"); + expect(browser().location().hash()).toEqual('123'); + }); + + it('should execute ng:click but not reload when href empty string and name specified', function() { + element('#link-4').click(); + expect(element('input[name=value]').val()).toEqual('4'); + expect(element('#link-4').attr('href')).toBe(""); + }); + + it('should execute ng:click but not reload when no href but name specified', function() { + element('#link-5').click(); + expect(element('input[name=value]').val()).toEqual('5'); + expect(element('#link-5').attr('href')).toBe(undefined); + }); + + it('should only change url when only ng:href', function() { + input('value').enter('6'); + element('#link-6').click(); + expect(browser().location().hash()).toEqual('/6'); + expect(element('#link-6').attr('href')).toBe("#/6"); + }); + </doc:scenario> + </doc:example> */ /** diff --git a/src/widgets.js b/src/widgets.js index 6aa0227c..a56a967e 100644 --- a/src/widgets.js +++ b/src/widgets.js @@ -821,7 +821,15 @@ angularWidget('a', function() { this.directives(true); return function(element) { - if (element.attr('href') === '') { + var hasNgHref = ((element.attr('ng:bind-attr') || '').indexOf('"href":') !== -1); + + // turn <a href ng:click="..">link</a> into a link in IE + // but only if it doesn't have name attribute, in which case it's an anchor + if (!hasNgHref && !element.attr('name') && !element.attr('href')) { + element.attr('href', ''); + } + + if (element.attr('href') === '' && !hasNgHref) { element.bind('click', function(event){ event.preventDefault(); }); |