如何在单击按钮时从ng-repeat的特定列中过滤网格视图数据

Question

JS文件：

$scope.GridFilter = function ()
{
    var ddlCategory = $('#ddlValue').val();
    $scope.search = ddlCategory;
}

CHtml：

    <select id="ddlValue" name="ddlValue">
       <option value="">-- Select any Value--</option>
       <option ng-repeat="item in DataObject" value="{{item.Category}}">{{item.Category}}</option>
    </select>
    <button ng-click="GridFilter()">Filter Grid</button>

网格：

<tr ng-repeat="item in DataGrid | filter:search">
      <td>{{item.Name}}</td>
      <td>{{item.Category}}</td>
      <td>{{item.Description}}</td>
      <td>{{item.Status}}</td>
</tr>

我想在单击按钮时从下拉值中筛选数据。它仅需要搜索“类别”列，但它搜索所有其他字段，因此网格显示了额外的记录。

Answer 1

您不需要JQuery选择器即可从下拉列表中获取选定的值。为此，在选择元素中添加ng-model。通过这种方式，表格将在不需要按钮的情况下根据下拉选择进行过滤：