formly-js / angular-formly

JavaScript powered forms for AngularJS
http://docs.angular-formly.com
MIT License
2.23k stars 405 forks source link

Hide expressions not being re-evaluated for fields in a nested formly-form #672

Closed nkimaina closed 8 years ago

nkimaina commented 8 years ago

Please look at the bin link to js bin. All the fields are sharing a model. However when the value of the model changes, in some cases the fields hide expressions are not re-evaluated based on this update. See bin for steps to reproduce.

kwypchlo commented 8 years ago

Well as to my knowledge, there are 2 separate watchers set up for hideExpressions - one on the global model, the one that you have firstName defined on and other for the subform and it watches only vm.model.address object. That said, only that second watcher fires hideExpressions on it's form so when you modify firstName the child form is not aware of that and does not fire any expressions.

You kind of hacked the hideExpression to use vm.model from the closure but you should probably only use arguments that hideExpression provides - then you would see that you cannot access firstName anyhow because your model is only vm.model.address.

You can however set up manual watcher on the child form and it will run the expressions when it changes:

{
  watcher: {
    expression: function() {
      return vm.model.firstName;
    },
    runFieldExpressions: true
  }
}
nkimaina commented 8 years ago

Thanks so much for the response. So if a field needs to know when several fields outside its form changes, then I have to set-up watchers for each of the other fields similar to your example?

kwypchlo commented 8 years ago

Yes, other than that you can specify not to use model watcher (which is expensive if your models weight a lot) and use form option watchAllExpressions and set it to true which will evaluate all expressions on each digest cycle. If you chose that, you can also try to disable the automatic model watcher which would be most likely redundant (set form option manualModelWatcher to true). That should do the trick also :)

mhawila commented 8 years ago

@kwypchlo thanks for such a nice explanation. One question though, where do I set watchAllExpressions to true and likewise manualModelWatcher

kwypchlo commented 8 years ago

@mhawila use options parameter documented in here http://docs.angular-formly.com/docs/formly-form