如何在没有用户输入的情况下更新 AngularJS 中的过滤列表答案

【问题标题】：How to update the filtered list in AngularJS without the user's input如何在没有用户输入的情况下更新 AngularJS 中的过滤列表
【发布时间】：2013-05-07 12:05:01
【问题描述】：

我正在使用filter，当用户在输入框中输入时，一切正常。我想要的是通过代码更新过滤结果（例如清除查询），而无需用户输入。我尝试触发更改事件或简单地清除输入字段的值，但没有任何成功。

这是我最简单的 HTML

<div ng-app ng-controller="test">    
    <input type="text" ng-model="query" placeholder="search..">
    <button>Clear</button>
    <ul class="unstyled">
        <li ng-repeat="item in list | filter:query">
            {{item}}
        </li>
    </ul>
</div>

这里是 JS：

function test($scope) {
    $scope.list = [120, 566, 777, 889, 998, 332, 112, 440, 881];

    $('button').click(function() {
        $('input').val('');
    });
}

JSFiddle

如何在不使用键盘删除输入内容的情况下取消过滤结果，但通过代码执行此操作（例如单击清除按钮）？

【问题讨论】：

标签： angularjs filtering

【解决方案1】：

不要通过 jQuery 注册您的事件处理程序，让ng-click 为您处理。

<button ng-click="clearBox()">Clear</button>


function test($scope) {
    $scope.list = [120, 566, 777, 889, 998, 332, 112, 440, 881];

    $scope.clearBox = function(){
      $scope.query = "";
    };
}

Updated fiddle

【讨论】：