I'm feeling a bit confused about why my ng-options is once again giving me an empty line with a filter applied.
Could you please take a look at this plunker to see the issue?
The goal is to show an org chart in a dropdown list that is based on a tree-structured object.
To achieve this, I created a service that flattens the tree into a one-dimensional object. I then use this service in a filter called within my ng-options.
<select ng-model="treeValue1" ng-init="treeValue1 = fields[0]" class='form-control'
ng-options="element as element.display for element in fields | flattenTree">
</select>
When I try this, it shows an empty line and when I select a value, it doesn't stay selected and goes back to the empty line. It's quite perplexing.
However, if I use the flatten function directly in the controller beforehand, it works smoothly.
<select ng-model="treeValue2" ng-init="treeValue2 = flatFields[0]" class='form-control'
ng-options="element as element.display for element in flatFields">
</select>
I'm not sure why the first method isn't working properly.
I would greatly appreciate your assistance, and if you could provide an explanation for this behavior, it would be fantastic.
Thank you!