added $invalidWidget service

Author: mhevery

scenario/widgets.html

@@ -15,7 +15,7 @@
       <tr><th colspan="3">Input text field</th></tr>
       <tr>
         <td>basic</td>
-        <td><input type="text" name="text.basic" ng-required /></td>
+        <td><input type="text" name="text.basic" ng-required ng-validate="number" ng-format="number"/></td>
         <td>text.basic={{text.basic}}</td>
       </tr>
       <tr>

src/Widgets.js

@@ -22,14 +22,19 @@ function valueAccessor(scope, element) {
   var validatorName = element.attr('ng-validate') || NOOP,
       validator = compileValidator(validatorName),
       required = element.attr('ng-required'),
-      lastError;
+      lastError,
+      invalidWidgets = scope.$invalidWidgets || {markValid:noop, markInvalid:noop};
   required = required || required === '';
   if (!validator) throw "Validator named '" + validatorName + "' not found.";
   function validate(value) {
     var error = required && !trim(value) ? "Required" : validator({self:scope, scope:{get:scope.$get, set:scope.$set}}, value);
     if (error !== lastError) {
       elementError(element, NG_VALIDATION_ERROR, error);
       lastError = error;
+      if (error)
+        invalidWidgets.markInvalid(element);
+      else
+        invalidWidgets.markValid(element);
     }
     return value;
   }

src/services.js

@@ -87,3 +87,18 @@ angularService("$hover", function(browser) {
     }
   });
 }, {inject:['$browser']});
+
+angularService("$invalidWidgets", function(){
+  var invalidWidgets = [];
+  invalidWidgets.markValid = function(element){
+    var index = indexOf(invalidWidgets, element);
+    if (index != -1)
+      invalidWidgets.splice(index, 1);
+  };
+  invalidWidgets.markInvalid = function(element){
+    var index = indexOf(invalidWidgets, element);
+    if (index === -1)
+      invalidWidgets.push(element);
+  };
+  return invalidWidgets;
+});

test/servicesSpec.js

@@ -54,3 +54,23 @@ describe("services", function(){
   });
 
 });
+
+describe("service $invalidWidgets", function(){
+  var scope;
+  beforeEach(function(){
+    scope = null;
+  });
+  afterEach(function(){
+    if (scope && scope.$element)
+      scope.$element.remove();
+  });
+
+  it("should count number of invalid widgets", function(){
+    var scope = compile('<input name="price" ng-required></input>').$init();
+    expect(scope.$invalidWidgets.length).toEqual(1);
+    scope.price = 123;
+    scope.$eval();
+    expect(scope.$invalidWidgets.length).toEqual(0);
+    scope.$element.remove();
+  });
+});