feat(compile): allow ngForm on attribute and class

#feature
- ngForm directive can now be used with element, class, and attributes

3 files changed, 34 insertions, 31 deletions

diff --git a/src/AngularPublic.js b/src/AngularPublic.js
index d0a0e045..c922c5e2 100644
--- a/src/AngularPublic.js
+++ b/src/AngularPublic.js
@@ -80,7 +80,7 @@ function publishExternalAPI(angular){
             ngClassOdd: ngClassOddDirective,
             ngCloak: ngCloakDirective,
             ngController: ngControllerDirective,
-            ngForm: formDirective,
+            ngForm: ngFormDirective,
             ngHide: ngHideDirective,
             ngInclude: ngIncludeDirective,
             ngInit: ngInitDirective,
diff --git a/src/directive/form.js b/src/directive/form.js
index 47274589..f4c96455 100644
--- a/src/directive/form.js
+++ b/src/directive/form.js
@@ -222,31 +222,32 @@ function FormController(name, element, attrs) {
       </doc:scenario>
     </doc:example>
  */
-var formDirective = [function() {
-  return {
-    name: 'form',
-    restrict: 'E',
-    inject: {
-      name: 'accessor'
-    },
-    controller: FormController,
-    compile: function() {
-      return {
-        pre: function(scope, formElement, attr, controller) {
-          formElement.bind('submit', function(event) {
-            if (!attr.action) event.preventDefault();
-          });
+var formDirectiveDev = {
+  name: 'form',
+  restrict: 'E',
+  inject: {
+    name: 'accessor'
+  },
+  controller: FormController,
+  compile: function() {
+    return {
+      pre: function(scope, formElement, attr, controller) {
+        formElement.bind('submit', function(event) {
+          if (!attr.action) event.preventDefault();
+        });
 
-          var parentFormCtrl = formElement.parent().inheritedData('$formController');
-          if (parentFormCtrl) {
-            formElement.bind('$destroy', function() {
-              parentFormCtrl.$removeControl(controller);
-              if (attr.name) delete scope[attr.name];
-              extend(controller, nullFormCtrl); //stop propagating child destruction handlers upwards
-            });
-          }
+        var parentFormCtrl = formElement.parent().inheritedData('$formController');
+        if (parentFormCtrl) {
+          formElement.bind('$destroy', function() {
+            parentFormCtrl.$removeControl(controller);
+            if (attr.name) delete scope[attr.name];
+            extend(controller, nullFormCtrl); //stop propagating child destruction handlers upwards
+          });
         }
-      };
-    }
-  };
-}];
+      }
+    };
+  }
+};
+
+var formDirective = valueFn(formDirectiveDev);
+var ngFormDirective = valueFn(extend(copy(formDirectiveDev), {restrict:'EAC'}));
diff --git a/test/directive/formSpec.js b/test/directive/formSpec.js
index 588b9f49..ec16e19b 100644
--- a/test/directive/formSpec.js
+++ b/test/directive/formSpec.js
@@ -176,17 +176,19 @@ describe('form', function() {
 
     it('should deregister a child form when its DOM is removed', function() {
       doc = jqLite(
-          '<ng:form name="parent">' +
-            '<ng:form name="child">' +
+          '<form name="parent">' +
+            '<div class="ng-form" name="child">' +
               '<input ng:model="modelA" name="inputA" required>' +
-            '</ng:form>' +
-          '</ng:form>');
+            '</div>' +
+          '</form>');
       $compile(doc)(scope);
       scope.$apply();
 
       var parent = scope.parent,
           child = scope.child;
 
+      expect(parent).toBeDefined();
+      expect(child).toBeDefined();
       expect(parent.$error.required).toEqual([child]);
       doc.children().remove(); //remove child