With only one array displaying titles, descriptions, and categories, the challenge arises when users can add their own categories. To showcase all categories and items, I utilized ng-repeat. The aim is to filter items using two filters: a text input for title filtering (which works well) and category buttons (currently not functioning).
The ng-repeat for categories is structured as follows:
<div class="list_categories">
<label ng-click="clearAll()" ng-repeat-start="x in categories" ng-if="$first">
<input type="radio" id="optradio" name="optradio" ng-model="searchCategory.Category" value="{{x}}" checked="checked">
<p>{{x}}</p>
</label>
<label ng-click="clearAll()" ng-repeat-end ng-if="!$first">
<input type="radio" id="optradio" name="optradio" ng-model="searchCategory.Category" value="{{x}}">
<p>{{x}}</p>
</label>
</div>
The ng-repeat for items looks like this:
<div class="card" ng-repeat="x in items | filter:searcher | filter:searchCategory" >
<div class="title-space">
<h2>{{x.Title}}</h2>
</div>
<div class="description-space">
<p>{{x.Description}}</p>
</div>
</div>
A functional example of the code can be found on this Plunker. Assistance is needed to get the Categories filter working properly.