adds manualModelWatcher option

formly-js · Jan 8, 2016 · 94215a3 · 94215a3
1 parent 5dbfbb8
commit 94215a3
Show file tree

Hide file tree

Showing 2 changed files with 45 additions and 16 deletions.
diff --git a/src/directives/formly-form.js b/src/directives/formly-form.js
@@ -112,28 +112,56 @@ function formlyForm(formlyUsability, formlyWarn, $parse, formlyConfig, $interpol
     setupFields()
 
     // watch the model and evaluate watch expressions that depend on it.
-    $scope.$watch('model', onModelOrFormStateChange, true)
+    if ($scope.options.manualModelWatcher) {
+      let stringWatchers = {}
+
+      angular.forEach($scope.fields, function(field, index) {
+        if (field.data && Array.isArray(field.data.watch)) {
+          field.data.watch.forEach(function(expression) {
+            if (typeof expression === 'string') {
+              stringWatchers[expression] = stringWatchers[expression] || []
+              stringWatchers[expression].push(runFieldExpressionProperties.bind(null, field, index))
+            } else {
+              $scope.$watch(expression, function manualFieldModelWatcher() {
+                runFieldExpressionProperties(field, index)
+              }, true)
+            }
+          })
+        }
+      })
+
+      for (let expression in stringWatchers) {
+        $scope.$watch(expression, function manualFieldModelWatcher() {
+          stringWatchers[expression].forEach(stringWatchers[expression])
+        }, true)
+      }
+    } else {
+      $scope.$watch('model', onModelOrFormStateChange, true)
+    }
+
     if ($scope.options.formState) {
       $scope.$watch('options.formState', onModelOrFormStateChange, true)
     }
 
     function onModelOrFormStateChange() {
-      angular.forEach($scope.fields, function runFieldExpressionProperties(field, index) {
-        const model = field.model || $scope.model
-        const promise = field.runExpressions && field.runExpressions()
-        if (field.hideExpression) { // can't use hide with expressionProperties reliably
-          const val = model[field.key]
-          field.hide = evalCloseToFormlyExpression(field.hideExpression, val, field, index)
-        }
-        if (field.extras && field.extras.validateOnModelChange && field.formControl) {
-          const validate = field.formControl.$validate
-          if (promise) {
-            promise.then(validate)
-          } else {
-            validate()
-          }
+      angular.forEach($scope.fields, runFieldExpressionProperties)
+    }
+
+    function runFieldExpressionProperties(field, index) {
+      const model = field.model || $scope.model
+      const promise = field.runExpressions && field.runExpressions()
+      if (field.hideExpression) { // can't use hide with expressionProperties reliably
+        const val = model[field.key]
+        field.hide = evalCloseToFormlyExpression(field.hideExpression, val, field, index)
+      }
+      if (field.extras && field.extras.validateOnModelChange && field.formControl) {
+        const validate = field.formControl.$validate
+        if (promise) {
+          promise.then(validate)
+        } else {
+          validate()
         }
-      })
+      }
     }
 
     function setupFields() {

diff --git a/src/providers/formlyApiCheck.js b/src/providers/formlyApiCheck.js
@@ -164,6 +164,7 @@ const formOptionsApi = apiCheck.shape({
   updateInitialValue: apiCheck.func.optional,
   removeChromeAutoComplete: apiCheck.bool.optional,
   templateManipulators: templateManipulators.optional,
+  manualModelWatcher: apiCheck.object.optional,
   wrapper: specifyWrapperType.optional,
   fieldTransform: apiCheck.oneOfType([
     apiCheck.func, apiCheck.array,