Improving hideExpression capabilities. hideExpressions can now be added to fields dynamically.

Author: Kent C. Dodds

dist/formly.js

@@ -80,41 +80,43 @@ angular.module('formly.render').directive('formlyField', [
   }
 ]);
 'use strict';
-angular.module('formly.render').directive('formlyForm', [
-  '$parse',
-  function formlyForm($parse) {
-    return {
-      restrict: 'AE',
-      templateUrl: 'directives/formly-form.html',
-      replace: true,
-      scope: {
-        fields: '=fields',
-        options: '=options',
-        result: '=result',
-        formOnParentScope: '=name'
-      },
-      compile: function (scope, iElement, iAttrs, controller, transcludeFn) {
-        return {
-          post: function (scope, ele, attr, controller) {
-            //Post gets called after angular has created the FormController
-            //Now pass the FormController back up to the parent scope
-            scope.formOnParentScope = scope[attr.name];
-            angular.forEach(scope.fields, function (field) {
-              if (field.hideExpression) {
-                var getter = $parse(field.hideExpression);
-                scope.$watch(function () {
-                  return getter(scope.result);
-                }, function (hide) {
-                  field.hide = hide;
-                });
-              }
-            });
-          }
-        };
+angular.module('formly.render').directive('formlyForm', function formlyForm() {
+  return {
+    restrict: 'AE',
+    templateUrl: 'directives/formly-form.html',
+    replace: true,
+    scope: {
+      fields: '=fields',
+      options: '=options',
+      result: '=result',
+      formOnParentScope: '=name'
+    },
+    compile: function (scope, iElement, iAttrs, controller, transcludeFn) {
+      return {
+        post: function (scope, ele, attr, controller) {
+          //Post gets called after angular has created the FormController
+          //Now pass the FormController back up to the parent scope
+          scope.formOnParentScope = scope[attr.name];
+        }
+      };
+    },
+    controller: [
+      '$scope',
+      '$element',
+      '$parse',
+      function ($scope, $element, $parse) {
+        $scope.$watch('result', function (newValue) {
+          angular.forEach($scope.fields, function (field, index) {
+            if (field.hideExpression) {
+              var getter = $parse(field.hideExpression);
+              field.hide = getter($scope.result);
+            }
+          });
+        }, true);
       }
-    };
-  }
-]);
+    ]
+  };
+});
 angular.module('formly.render').run([
   '$templateCache',
   function ($templateCache) {

dist/formly.min.js

@@ -1,6 +1,6 @@
 'use strict';
 angular.module('formly.render')
-.directive('formlyForm', function formlyForm($parse) {
+.directive('formlyForm', function formlyForm() {
 	return {
 		restrict: 'AE',
 		templateUrl: 'directives/formly-form.html',
@@ -17,26 +17,18 @@ angular.module('formly.render')
 					//Post gets called after angular has created the FormController
 					//Now pass the FormController back up to the parent scope
 					scope.formOnParentScope = scope[attr.name];
-
-					var watches = {};
-					angular.forEach(scope.fields, function(field) {
-						if (field.hideExpression) {
-							watches[field.hideExpression] = watches[field.hideExpression] || [];
-							watches[field.hideExpression].push(field);
-						}
-					});
-					angular.forEach(watches, function(fields, expression) {
-						var getter = $parse(expression);
-						scope.$watch(function() {
-							return getter(scope.result);
-						}, function(hide) {
-							angular.forEach(fields, function(field) {
-								field.hide = hide;
-							});
-						});
-					});
 				}
 			}
+		},
+		controller: function($scope, $element, $parse) {
+			$scope.$watch('result', function(newValue) {
+                angular.forEach($scope.fields, function(field, index) {
+                    if (field.hideExpression) {
+                        var getter = $parse(field.hideExpression);
+                        field.hide = getter($scope.result);
+                    }
+                });
+            }, true);
 		}
 	};
 });

dist/formly.min.map

@@ -137,20 +137,14 @@ app.controller('home', function($scope, $parse, $rootScope) {
 		key: 'hiddenWhenUnchecked',
 		type: 'text',
 		label: 'Conditional input',
-		placeholder: 'These both use the same hideExpression...',
-		hideExpression: '!checkThis'
-	}, {
-		key: 'hiddenWhenUnchecked2',
-		type: 'text',
-		label: 'Type "joe" in here',
-		placeholder: '... so there is only one $watch for both of them',
+		placeholder: 'This is a big secret! Try typing "joe"',
 		hideExpression: '!checkThis'
 	}, {
 		key: 'showWhenJoe',
 		type: 'text',
 		label: 'You typed Joe! You found me!',
-		placeholder: 'Different hideExpression, different $watch',
-		hideExpression: 'hiddenWhenUnchecked2 !== "joe"'
+		placeholder: 'hideExpressions are evaluated on the result',
+		hideExpression: 'hiddenWhenUnchecked !== "joe"'
 	}, {
 		key:'secretCode',
 		type: 'hidden',