fix($compile): clean up @-binding observers when re-assigning bindings

jonathantyates · gkalpak · commit 586e2acb2690 · 2016-10-20T19:26:01.000+03:00
Fixes angular#15268 Closes angular#15298
diff --git a/src/ng/compile.js b/src/ng/compile.js
@@ -3434,7 +3434,7 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
             if (!optional && !hasOwnProperty.call(attrs, attrName)) {
               destination[scopeName] = attrs[attrName] = undefined;
             }
-            attrs.$observe(attrName, function(value) {
+            removeWatch = attrs.$observe(attrName, function(value) {
               if (isString(value) || isBoolean(value)) {
                 var oldValue = destination[scopeName];
                 recordChanges(scopeName, value, oldValue);
@@ -3453,6 +3453,7 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
               destination[scopeName] = lastValue;
             }
             initialChanges[scopeName] = new SimpleChange(_UNINITIALIZED_VALUE, destination[scopeName]);
+            removeWatchCollection.push(removeWatch);
             break;
 
           case '=':
diff --git a/test/ng/compileSpec.js b/test/ng/compileSpec.js
@@ -4378,6 +4378,37 @@ describe('$compile', function() {
             });
           });
 
+          it('should clean up `@`-binding observers when re-assigning bindings', function() {
+            var constructorSpy = jasmine.createSpy('constructor');
+            var prototypeSpy = jasmine.createSpy('prototype');
+
+            function TestController() {
+              return {$onChanges: constructorSpy};
+            }
+            TestController.prototype.$onChanges = prototypeSpy;
+
+            module(function($compileProvider) {
+              $compileProvider.component('test', {
+                bindings: {attr: '@'},
+                controller: TestController
+              });
+            });
+
+            inject(function($compile, $rootScope) {
+              var template = '<test attr="{{a}}"></test>';
+              $rootScope.a = 'foo';
+
+              element = $compile(template)($rootScope);
+              $rootScope.$digest();
+              expect(constructorSpy).toHaveBeenCalled();
+              expect(prototypeSpy).not.toHaveBeenCalled();
+
+              constructorSpy.calls.reset();
+              $rootScope.$apply('a = "bar"');
+              expect(constructorSpy).toHaveBeenCalled();
+              expect(prototypeSpy).not.toHaveBeenCalled();
+            });
+          });
 
           it('should not call `$onChanges` twice even when the initial value is `NaN`', function() {
             var onChangesSpy = jasmine.createSpy('$onChanges');
