显示所选项目的过滤问题

Filtering issue for showing selected item

本文关键字：过滤 问题 项目 选项 显示      更新时间：2023-09-26

我正在尝试开发一个按类别筛选项目的示例。下面的代码块显示了按类别筛选器的项目列表。

 <div class="form-group">
    <label class="control-label" for="order_id">Filter by Category</label>
    <select class="form-control m-b" name="category" ng-model="item.searchString">
    <option value="">All</option>
    <option ng-repeat="category in item.itemscategory" value="{{category.name}}">{{category.name}}</option>
</select>
</div>
<div class="chat-user" ng-repeat="iteme in item.items | filter:item.filterSearch"
 ng-class="{'text-navy':$first == true}">
        <a id="{{iteme.id}}" 
        href="" ng-click="item.selectitem(iteme)">{{iteme.name}}</a>
</div>

如果我选择列表中的任何项目并更改类别以过滤它们，我希望默认情况下该项目将被选中，如果列表中存在或选择列表中的第一个项目。

在Js中可以设置:

$scope.firstItemInTheList= item.itemscategory[0];

保存第一项，也将其设置为select标签中的ng-model。

<div class="form-group">
    <label class="control-label" for="order_id">Filter by Category</label>
<select class="form-control m-b" name="category" ng-model="firstItemInTheList">
    <option value="">All</option>
    <option ng-repeat="category in item.itemscategory" value="{{category.name}}">{{category.name}}</option>
</select>
</div>
<div class="chat-user" ng-repeat="iteme in item.items | filter:firstItemInTheList"
 ng-class="{'text-navy':$first == true}">
    <a id="{{iteme.id}}" href="" ng-click="item.selectitem(iteme)">{{iteme.name}}</a>
</div>

如果您没有从select中选择任何选项，则使用此过滤器

$scope.firstItemInTheList= item.itemscategory[0];

过滤器。

相关文章：