mirror of
https://github.com/zhigang1992/angular.js.git
synced 2026-04-02 22:37:07 +08:00
feat(ngHref): bind ng-href to xlink:href for SVGAElement
This change makes the ngHref directive useful for SVGAElements by having it bind to the xlink:href attribute rather than the href attribute. Closes #5904
This commit is contained in:
@@ -369,17 +369,27 @@ forEach(['src', 'srcset', 'href'], function(attrName) {
|
||||
return {
|
||||
priority: 99, // it needs to run after the attributes are interpolated
|
||||
link: function(scope, element, attr) {
|
||||
var propName = attrName,
|
||||
name = attrName;
|
||||
|
||||
if (attrName === 'href' &&
|
||||
toString.call(element.prop('href')) === '[object SVGAnimatedString]') {
|
||||
name = 'xlinkHref';
|
||||
attr.$attr[name] = 'xlink:href';
|
||||
propName = null;
|
||||
}
|
||||
|
||||
attr.$observe(normalized, function(value) {
|
||||
if (!value)
|
||||
return;
|
||||
|
||||
attr.$set(attrName, value);
|
||||
attr.$set(name, value);
|
||||
|
||||
// on IE, if "ng:src" directive declaration is used and "src" attribute doesn't exist
|
||||
// then calling element.setAttribute('src', 'foo') doesn't do anything, so we need
|
||||
// to set the property as well to achieve the desired effect.
|
||||
// we use attr[attrName] value since $set can sanitize the url.
|
||||
if (msie) element.prop(attrName, attr[attrName]);
|
||||
if (msie && propName) element.prop(propName, attr[name]);
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
@@ -251,4 +251,28 @@ describe('ngHref', function() {
|
||||
$rootScope.$digest();
|
||||
expect(element.attr('href')).toEqual('http://server');
|
||||
}));
|
||||
|
||||
if (isDefined(window.SVGElement)) {
|
||||
describe('SVGAElement', function() {
|
||||
it('should interpolate the expression and bind to xlink:href', inject(function($compile, $rootScope) {
|
||||
element = $compile('<svg><a ng-href="some/{{id}}"></a></svg>')($rootScope);
|
||||
var child = element.children('a');
|
||||
$rootScope.$digest();
|
||||
expect(child.attr('xlink:href')).toEqual('some/');
|
||||
|
||||
$rootScope.$apply(function() {
|
||||
$rootScope.id = 1;
|
||||
});
|
||||
expect(child.attr('xlink:href')).toEqual('some/1');
|
||||
}));
|
||||
|
||||
|
||||
it('should bind xlink:href even if no interpolation', inject(function($rootScope, $compile) {
|
||||
element = $compile('<svg><a ng-href="http://server"></a></svg>')($rootScope);
|
||||
var child = element.children('a');
|
||||
$rootScope.$digest();
|
||||
expect(child.attr('xlink:href')).toEqual('http://server');
|
||||
}));
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user