Angularjs在按钮点击时清除多个过滤器

时间:2016-05-02 02:53:19

标签: javascript jquery angularjs angularjs-filter

我在页面上有各种选择框的多个过滤器。我的理想功能是让用户只需单击一下按钮即可重置所有过滤器。我可以通过选择框单独实现此功能,以重置特定的过滤器,但不能同时重置多个过滤器。

这是代码 -

                                    <div class="col-md-2">
                                    <select class="form-control" ng-model="typeFilter">
                                        <option value="">All</option>
                                        <option>Stock</option>
                                        <option>Special Order</option>
                                        <option>Part</option>
                                    </select>    
                                </div>
                                <div class="col-md-2">  
                                    <select class="form-control" ng-model="itemStatus">
                                        <option value="">All</option>
                                        <option>Active</option>
                                        <option>Discontinued</option>
                                        <option>Obsolete</option>
                                        <option>Deleted</option>
                                    </select>                                                                              
                                </div>
                                <div class="col-md-2">
                                    <button type="button" class="btn btn-large button-dropdown" data-translate="Rest_Filters" ng-click="vm.clearFilter()"> Rest Filters</button>
                                </div>

我尝试过的控件 -

    vm.clearFilter = function () {
    vm.typeFilter = {};
    vm.typeFilter = "";
    vm.typeFilter = null;

    vm.itemStatus = {};
    vm.itemStatus = "";
    vm.itemStatus = null;
}

我还尝试过内联语法,例如

 ng-click="typeFilter = null"
 ng-click="typeFilter = {}"

和其他几个但似乎没有什么可以清除过滤器。

由于

1 个答案:

答案 0 :(得分:0)

它是指针变量

的东西
  $scope.clearFilter = function() {
    $scope.typeFilter = null;
    $scope.itemStatus = null;
  }

Plunker:https://plnkr.co/edit/eRw7L6c8Cd84oLUUDnQm?p=preview