Promise-based validations & Multi-stage validation API for ngModel

src/ng/directive/form.js

@@ -5,9 +5,11 @@ var nullFormCtrl = {
   $addControl: noop,
   $removeControl: noop,
   $setValidity: noop,
+  $$setPending: noop,
   $setDirty: noop,
   $setPristine: noop,
-  $setSubmitted: noop
+  $setSubmitted: noop,
+  $$clearControlValidity: noop
 },
 SUBMITTED_CLASS = 'ng-submitted';
 
@@ -53,8 +55,9 @@ function FormController(element, attrs, $scope, $animate) {
   var form = this,
       parentForm = element.parent().controller('form') || nullFormCtrl,
       invalidCount = 0, // used to easily determine if we are valid
-      errors = form.$error = {},
-      controls = [];
+      pendingCount = 0,
+      controls = [],
+      errors = form.$error = {};
 
   // init state
   form.$name = attrs.name || attrs.ngForm;
@@ -144,13 +147,37 @@ function FormController(element, attrs, $scope, $animate) {
     if (control.$name && form[control.$name] === control) {
       delete form[control.$name];
     }
-    forEach(errors, function(queue, validationToken) {
-      form.$setValidity(validationToken, true, control);
-    });
 
+    form.$$clearControlValidity(control);
     arrayRemove(controls, control);
   };
 
+  form.$$clearControlValidity = function(control) {
+    forEach(form.$pending, clear);
+    forEach(errors, clear);
+
+    function clear(queue, validationToken) {
+      form.$setValidity(validationToken, true, control);
+    }
+
+    parentForm.$$clearControlValidity(form);
+  };
+
+  form.$$setPending = function(validationToken, control) {
+    var pending = form.$pending && form.$pending[validationToken];
+
+    if (!pending || !includes(pending, control)) {
+      pendingCount++;
+      form.$valid = form.$invalid = undefined;
+      form.$pending = form.$pending || {};
+      if (!pending) {
+        pending = form.$pending[validationToken] = [];
+      }
+      pending.push(control);
+      parentForm.$$setPending(validationToken, form);
+    }
+  };
+
   /**
    * @ngdoc method
    * @name form.FormController#$setValidity
@@ -162,24 +189,56 @@ function FormController(element, attrs, $scope, $animate) {
    */
   form.$setValidity = function(validationToken, isValid, control) {
     var queue = errors[validationToken];
+    var pendingChange, pending = form.$pending && form.$pending[validationToken];
+
+    if (pending) {
+      pendingChange = indexOf(pending, control) >= 0;
+      if (pendingChange) {
+        arrayRemove(pending, control);
+        pendingCount--;
+
+        if (pending.length === 0) {
+          delete form.$pending[validationToken];
+        }
+      }
+    }
+
+    var pendingNoMore = form.$pending && pendingCount === 0;
+    if (pendingNoMore) {
+      form.$pending = undefined;
+    }
 
     if (isValid) {
-      if (queue) {
-        arrayRemove(queue, control);
-        if (!queue.length) {
-          invalidCount--;
+      if (queue || pendingChange) {
+        if (queue) {
+          arrayRemove(queue, control);
+        }
+        if (!queue || !queue.length) {
+          if (errors[validationToken]) {
+            invalidCount--;
+          }
           if (!invalidCount) {
-            toggleValidCss(isValid);
-            form.$valid = true;
-            form.$invalid = false;
+            if (!form.$pending) {
+              toggleValidCss(isValid);
+              form.$valid = true;
+              form.$invalid = false;
+            }
+          } else if(pendingNoMore) {
+            toggleValidCss(false);
+            form.$valid = false;
+            form.$invalid = true;
           }
           errors[validationToken] = false;
           toggleValidCss(true, validationToken);
           parentForm.$setValidity(validationToken, true, form);
         }
       }
-
     } else {
+      if (!form.$pending) {
+        form.$valid = false;
+        form.$invalid = true;
+      }
+
       if (!invalidCount) {
         toggleValidCss(isValid);
       }
@@ -192,9 +251,6 @@ function FormController(element, attrs, $scope, $animate) {
         parentForm.$setValidity(validationToken, false, form);
       }
       queue.push(control);
-
-      form.$valid = false;
-      form.$invalid = true;
     }
   };