formly-js / angular-formly

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

Multi-Input with dynamic expressionProperties #619

Open nvdnkpr opened 8 years ago

nvdnkpr commented 8 years ago

Hello, I was working with the multi-input example and removed the buttons. Instead, if the last input of the multi-input is filled, another input is added. Vice versa if the input before the last input is cleared, the last input get's removed. That works like a charm.

You can play with it here: http://jsbin.com/mohevimiya/1/edit?html,js,output

The point is that I need to mark the multiple inputs as required, and since the last one input will always be empty (otherwise we would add another input), this last input should be excluded from being required.

I thought I can solve this by using expressionProperties (you see my current attempt to solve that, with the expressionProperty set for 'templateOptions.required', which compares the 'index' of the multi field with the length of the array of the model:

expressionProperties:{
  "templateOptions.required": "index+1 !== model.kids.length"
}

The problem is that this comparison is always false when add new fields gets added, but actually should change when more fields are added e.g. if you fill the first two inputs (which adds a third empty field), then the two first fields required property true, but they stay false from the moment they were added.

abodacs commented 8 years ago

@nvdnkpr any updates for this issue ??

nvdnkpr commented 8 years ago

not yet @abodacs