Condition on every form type

Works exactly the same as the condition form type (which now becomes deprecated).

Author: davidlgj

src/directives/decorators/bootstrap/section.html

@@ -1,4 +1,3 @@
-<div class="schema-form-section {{form.htmlClass}}" 
-     ng-if="!form.condition || evalExpr(form.condition,{ model: model, 'arrayIndex': arrayIndex })">
+<div class="schema-form-section {{form.htmlClass}}">
   <sf-decorator ng-repeat="item in form.items" form="item"></sf-decorator>
 </div>

src/services/decorators.js

@@ -40,29 +40,6 @@ angular.module('schemaForm').provider('schemaFormDecorators',
           scope: true,
           require: '?^sfSchema',
           link: function(scope, element, attrs, sfSchema) {
-            //rebind our part of the form to the scope.
-            var once = scope.$watch(attrs.form, function(form) {
-
-              if (form) {
-                scope.form  = form;
-
-                //ok let's replace that template!
-                //We do this manually since we need to bind ng-model properly and also
-                //for fieldsets to recurse properly.
-                var url = templateUrl(name, form);
-                $http.get(url, {cache: $templateCache}).then(function(res) {
-                  var key = form.key ?
-                            sfPathProvider.stringify(form.key).replace(/"/g, '"') : '';
-                  var template = res.data.replace(
-                    /\$\$value\$\$/g,
-                    'model' + (key[0] !== '[' ? '.' : '') + key
-                  );
-                  element.html(template);
-                  $compile(element.contents())(scope);
-                });
-                once();
-              }
-            });
 
             //Keep error prone logic from the template
             scope.showTitle = function() {
@@ -158,8 +135,47 @@ angular.module('schemaForm').provider('schemaFormDecorators',
 
               //Otherwise we only have input number not being a number
               return 'Not a number';
-
             };
+
+            // Rebind our part of the form to the scope.
+            var once = scope.$watch(attrs.form, function(form) {
+              if (form) {
+                scope.form  = form;
+
+                //ok let's replace that template!
+                //We do this manually since we need to bind ng-model properly and also
+                //for fieldsets to recurse properly.
+                var url = templateUrl(name, form);
+                $http.get(url, {cache: $templateCache}).then(function(res) {
+                  var key = form.key ?
+                            sfPathProvider.stringify(form.key).replace(/"/g, '"') : '';
+                  var template = res.data.replace(
+                    /\$\$value\$\$/g,
+                    'model' + (key[0] !== '[' ? '.' : '') + key
+                  );
+                  element.html(template);
+
+                  // Do we have a condition? Then we slap on an ng-if on all children,
+                  // but be nice to existing ng-if.
+                  if (form.condition) {
+                    element.children().each(function() {
+                      var ngIf = this.getAttribute('ng-if');
+                      this.setAttribute(
+                        'ng-if',
+                        ngIf ?
+                        '(' + ngIf +
+                        ') || (evalExpr(form.condition,{ model: model, "arrayIndex": arrayIndex }))'
+                        : 'evalExpr(form.condition,{ model: model, "arrayIndex": arrayIndex })'
+                      );
+                    });
+                  }
+
+                  $compile(element.contents())(scope);
+                });
+
+                once();
+              }
+            });
           }
         };
       }

test/directives/schema-form-test.js

@@ -454,7 +454,7 @@ describe('directive',function(){
     });
   });
 
-  
+
   it('should honor defaults in schema',function(){
 
     inject(function($compile,$rootScope){
@@ -1678,5 +1678,44 @@ describe('directive',function(){
     });
   });
 
+  it('should remove or add fields depending on condition',function(done) {
+
+    inject(function($compile, $rootScope){
+      var scope = $rootScope.$new();
+      scope.person = {
+        flag: true
+      };
+
+      scope.schema = {
+        type: 'object',
+        properties: {
+          name: {type: 'string'}
+        }
+      };
+
+      scope.form = [
+        {
+          key:'name',
+          condition: 'person.flag'
+        }
+      ];
+
+      var tmpl = angular.element('<form sf-schema="schema" sf-form="form" sf-model="person"></form>');
+
+      $compile(tmpl)(scope);
+      $rootScope.$apply();
+      
+      tmpl.children().find('.schema-form-text').length.should.be.equal(1);
+
+      setTimeout(function() {
+        scope.person.flag = false;
+        $rootScope.$apply();
+        tmpl.children().find('.schema-form-text').length.should.be.equal(0);
+        done();
+      }, 0);
+
+    });
+  });
+
 
 });