I have a dropdown in an ng-repeat which stores id of the item in ng-model
<tr ng-repeat="bill in billItems track by $index">
And, I have a filter in my ng-options that iterates over a list like this:-
<td>
<select ng-model="bill.itemId" ng-required="true"
ng-options="item.itemId as item.itemName for item in itemRates |
exclude: bill.itemId: billItems">
<option value="">Select Here</option>
</select>
</td>
And an add button that adds the same dropdown below, but does not show the option already selected in the above dropdown for the next one. In a way, very similar to this fiddle. (Also see the exclude function written in the app.js file) http://plnkr.co/edit/zJnExGHQ9hJznoF4TyZI?p=preview
The above helps me to disable select option in the next dropdown I add.
Barring a few tweaks, the code written in the above filter function is very similar to mine.
However, the issue I am facing is that it keeps getting repeatedly called, even though I just open the state (html page) containing the dropdown(s).
Have verified this by using a console.log("In exclude function()") statement in the same.
Another problem, supposedly due to this is that the sequence in which I add billItems in my dropdown(s) shuffles at random, when the page is saved and I open it again.
For instance, I have added around 5 billItems in the dropdown, say sequentially from billItem1, billItem2, and so on till billItem5.
When I persist this data (I have a save button) in the billItems array, got to a different state , and again return to this state (Using the edit button) and check the billItems array, the sequence has been changed.
I can see the sequence like this billItem2, billItem1, billItem3, billItem4, billItem5 in that order in the array now.
Again, when I do this entire thing again, the sequence again shuffles. How exactly do I prevent this ?
I expect the result to be in the same sequence as I have added the dropdowns one after another.
How can it be achieved ?
However, the issue I am facing is that it keeps getting repeatedly called, even though I just open the state (html page) containing the dropdown(s).
In AngularJS, every filter is called at least once during each digest cycle. Opening a dropdown triggers a digest cycle so all filters are called at least once each time.
When I persist this data (I have a save button) in the billItems array, got to a different state , and again return to this state (Using the edit button) and check the billItems array, the sequence has been changed.
It's hard to say why this is happening. This is most likely not an issue with your code but rather with the backend API which is returning the data. For example, SQL Server does not guarantee the order of results unless you explicitly add an ORDER BY clause to the SELECT statement. Does the displayed order differ from the order which is returned by the API?