fix(formController): do not let removed controls affect forms

Closes angular#9035

Author: shahata

src/ng/directive/form.js

@@ -71,6 +71,17 @@ function FormController(element, attrs, $scope, $animate, $interpolate) {
   form.$invalid = false;
   form.$submitted = false;
 
+  // Setup initial state of the control
+  element.addClass(PRISTINE_CLASS);
+
+  this.$$setParentForm = function(form) {
+    parentForm = form;
+  };
+
+  this.$$getParentForm = function(form) {
+    return parentForm;
+  };
+
   parentForm.$addControl(form);
 
   /**
@@ -125,6 +136,7 @@ function FormController(element, attrs, $scope, $animate, $interpolate) {
     if (control.$name) {
       form[control.$name] = control;
     }
+    control.$$setParentForm(form);
   };
 
   // Private API: rename a form control
@@ -159,6 +171,7 @@ function FormController(element, attrs, $scope, $animate, $interpolate) {
     });
 
     arrayRemove(controls, control);
+    control.$$setParentForm(nullFormCtrl);
   };
 
 

src/ng/directive/input.js

@@ -1726,6 +1726,14 @@ var NgModelController = ['$scope', '$exceptionHandler', '$attrs', '$element', '$
     }
   };
 
+  this.$$setParentForm = function(form) {
+    parentForm = form;
+  };
+
+  this.$$getParentForm = function(form) {
+    return parentForm;
+  };
+
   /**
    * @ngdoc method
    * @name ngModel.NgModelController#$render
@@ -1800,7 +1808,6 @@ var NgModelController = ['$scope', '$exceptionHandler', '$attrs', '$element', '$
     unset: function(object, property) {
       delete object[property];
     },
-    parentForm: parentForm,
     $animate: $animate
   });
 
@@ -2411,12 +2418,12 @@ var ngModelDirective = function() {
 
           attr.$observe('name', function(newValue) {
             if (modelCtrl.$name !== newValue) {
-              formCtrl.$$renameControl(modelCtrl, newValue);
+              modelCtrl.$$getParentForm().$$renameControl(modelCtrl, newValue);
             }
           });
 
           scope.$on('$destroy', function() {
-            formCtrl.$removeControl(modelCtrl);
+            modelCtrl.$$getParentForm().$removeControl(modelCtrl);
           });
         },
         post: function ngModelPostLink(scope, element, attr, ctrls) {
@@ -2987,7 +2994,6 @@ function addSetValidityMethod(context) {
       classCache = {},
       set = context.set,
       unset = context.unset,
-      parentForm = context.parentForm,
       $animate = context.$animate;
 
   classCache[INVALID_CLASS] = !(classCache[VALID_CLASS] = $element.hasClass(VALID_CLASS));
@@ -3038,7 +3044,7 @@ function addSetValidityMethod(context) {
       combinedState = null;
     }
     toggleValidationCss(validationErrorKey, combinedState);
-    parentForm.$setValidity(validationErrorKey, combinedState, ctrl);
+    ctrl.$$getParentForm().$setValidity(validationErrorKey, combinedState, ctrl);
   }
 
   function createAndSet(name, value, options) {

test/ng/directive/formSpec.js

@@ -58,6 +58,50 @@ describe('form', function() {
     expect(form.alias).toBeUndefined();
   });
 
+  it('should not be affected by input controls that were removed from the form', function() {
+    doc = $compile(
+      '<form name="myForm">' +
+        '<input ng-if="inputExists" name="alias" ng-model="value" store-model-ctrl/>' +
+      '</form>')(scope);
+
+    scope.$apply('inputExists = true');
+    control.$setValidity('required', false);
+    scope.$apply('inputExists = false');
+
+    var form = scope.myForm;
+    expect(form.$error.required).toBeFalsy();
+  });
+
+  it('should not be affected by form controls that were removed from the form', function() {
+    doc = $compile(
+      '<form name="myForm">' +
+        '<div ng-form="nestedForm" ng-if="formExists">' +
+          '<input type="text" name="alias" ng-model="value" store-model-ctrl/>' +
+        '</div>' +
+      '</form>')(scope);
+
+    scope.$apply('formExists = true');
+    control.$setValidity('required', false);
+    scope.$apply('formExists = false');
+
+    var form = scope.myForm;
+    expect(form.$error.required).toBeFalsy();
+  });
+
+  it('should be affected by input controls that were re-added to the form', function() {
+    doc = $compile(
+      '<form name="myForm">' +
+        '<input ng-if="inputExists" name="alias" ng-model="value" store-model-ctrl/>' +
+      '</form>')(scope);
+
+    scope.$apply('inputExists = true');
+    scope.$apply('inputExists = false');
+    scope.$apply('inputExists = true');
+    control.$setValidity('required', false);
+
+    var form = scope.myForm;
+    expect(form.$error.required).toEqual([control]);
+  });
 
   it('should use ngForm value as form name', function() {
     doc = $compile(