I am trying to organize a list by category, but the challenge is that each category input is customized and can be added by any user in the list.
My initial attempt involved using ng-repeat to filter out duplicate values (as seen in the code snippet unique:'Category' below). I set the Category name as the filter value and also included an "All" category option to display all elements:
<ul class="categoriesList">
<li>
<label>
<input type="radio" ng-model="searchCategory.Category" value=""> All
</label>
</li>
<li ng-repeat="x in myList | unique:'Category'">
</label>
<input type="radio" ng-model="searchCategory.Category" value="{{x.Category}}"> {{x.Category}}
</label>
</li>
</ul>
Unfortunately, this method is not yielding the desired results. Here is a Plunker example demonstrating my issue: Link to Plunker
I need a solution that allows for the addition of any custom category in the JSON data example, while still being able to effectively filter them. Thank you in advance for your help.