diff --git a/src/ng/directive/ngStyle.js b/src/ng/directive/ngStyle.js index 844029904202..afb7a79d269d 100644 --- a/src/ng/directive/ngStyle.js +++ b/src/ng/directive/ngStyle.js @@ -52,10 +52,10 @@ */ var ngStyleDirective = ngDirective(function(scope, element, attr) { - scope.$watch(attr.ngStyle, function ngStyleWatchAction(newStyles, oldStyles) { + scope.$watchCollection(attr.ngStyle, function ngStyleWatchAction(newStyles, oldStyles) { if (oldStyles && (newStyles !== oldStyles)) { forEach(oldStyles, function(val, style) { element.css(style, '');}); } if (newStyles) element.css(newStyles); - }, true); + }); }); diff --git a/test/ng/directive/ngStyleSpec.js b/test/ng/directive/ngStyleSpec.js index b708eb7a4d82..7a8cfb2cd75f 100644 --- a/test/ng/directive/ngStyleSpec.js +++ b/test/ng/directive/ngStyleSpec.js @@ -23,6 +23,33 @@ describe('ngStyle', function() { })); + it('should not deep watch objects', inject(function($rootScope, $compile) { + element = $compile('
')($rootScope); + $rootScope.$digest(); + expect(parseInt(element.css('height') + 0, 10)).toEqual(0); // height could be '' or '0px' + $rootScope.heightObj = {toString: function() { return '40px'; }}; + $rootScope.$digest(); + expect(element.css('height')).toBe('40px'); + + element.css('height', '10px'); + $rootScope.heightObj.otherProp = 123; + $rootScope.$digest(); + expect(element.css('height')).toBe('10px'); + })); + + + it('should support binding for object literals', inject(function($rootScope, $compile) { + element = $compile('
')($rootScope); + $rootScope.$digest(); + expect(parseInt(element.css('height') + 0, 10)).toEqual(0); // height could be '' or '0px' + $rootScope.$apply('heightStr = "40px"'); + expect(element.css('height')).toBe('40px'); + + $rootScope.$apply('heightStr = "100px"'); + expect(element.css('height')).toBe('100px'); + })); + + it('should support lazy one-time binding for object literals', inject(function($rootScope, $compile) { element = $compile('
')($rootScope); $rootScope.$digest();