We recently put together a component to manage an array (add/update/remove strings from the array) and found some unexpected rendering behavior. We were able to work around it, however I felt that our initial approach should have worked. That approach was as follows:
didReceiveAttrs, add an empty string for a new item
- On input, update the item and (if editing the last item, add a new empty string)
- On change, remove empty items
- (elsewhere, remove empty strings)
Here’s a twiddle that demonstrates the weirdness that ensues. Note the way the array renders in the list after trying to add a new item.