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

Commit

Permalink
fix(ngSrc,ngHref): binding should set element prop as well as attr
Browse files Browse the repository at this point in the history
IE9 ignores setAttribute('src', val) calls on img if "ng:src" attribute
is present. It only fetches the image if element property is updated as well.

Closes #935
  • Loading branch information
IgorMinar committed May 7, 2012
1 parent 49dfdf8 commit b24cc63
Show file tree
Hide file tree
Showing 2 changed files with 29 additions and 1 deletion.
6 changes: 6 additions & 0 deletions src/ng/directive/booleanAttrs.js
Original file line number Diff line number Diff line change
Expand Up @@ -310,10 +310,16 @@ forEach(['src', 'href'], function(attrName) {
attr.$$observers[attrName] = [];
attr.$observe(normalized, function(value) {
attr.$set(attrName, 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
if (msie) element.prop(attrName, value);
});
} else {
// value present means that no interpolation, so copy to native attribute.
attr.$set(attrName, value);
element.prop(attrName, value);
}
};
}
Expand Down
24 changes: 23 additions & 1 deletion test/ng/directive/booleanAttrsSpec.js
Original file line number Diff line number Diff line change
Expand Up @@ -80,7 +80,8 @@ describe('boolean attr directives', function() {
describe('ngSrc', function() {

it('should interpolate the expression and bind to src', inject(function($compile, $rootScope) {
var element = $compile('<div ng-src="some/{{id}}"></div>')($rootScope)
var element = $compile('<div ng-src="some/{{id}}"></div>')($rootScope);

$rootScope.$digest();
expect(element.attr('src')).toEqual('some/');

Expand All @@ -91,6 +92,27 @@ describe('ngSrc', function() {

dealoc(element);
}));

if (msie) {
it('should update the element property as well as the attribute', inject(
function($compile, $rootScope) {
// 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

var element = $compile('<div ng-src="some/{{id}}"></div>')($rootScope);

$rootScope.$digest();
expect(element.prop('src')).toEqual('some/');

$rootScope.$apply(function() {
$rootScope.id = 1;
});
expect(element.prop('src')).toEqual('some/1');

dealoc(element);
}));
}
});


Expand Down

0 comments on commit b24cc63

Please sign in to comment.