angularjs - 如何使用 AngularJS 过滤器默认表搜索结果隐藏？

Question

在下面的 Angularjs 片段中，默认情况下会显示整个表格，并在您开始输入时被过滤掉。

1. 将其更改为默认不显示任何结果并且仅在至少 3 个结果与搜索查询匹配之后才开始显示结果的最佳做法是什么？

2. 额外的问题，如果输入了至少 2 个字符，你将如何只显示结果？

网页：

<div ng-app="myApp">
    <div ng-controller="PeopleCtrl">
        <input type="text" ng-model="search.$">
        <table>
            <tr ng-repeat="person in population.sample | filter:search">
                <td>{{person.name}}</td>
                <td>{{person.job}}</td>
            </tr>
        </table>
    </div>
</div>

主.js：

var myApp = angular.module('myApp', []);
myApp.factory('Population', function () {
    var Population = {};
    Population.sample = [
        {
            name: "Bob",
            job: "Truck driver"
        }
        // etc.
    ];
    return Population;
});

function PeopleCtrl($scope, Population) {
    $scope.people = Population;
}

Answer 1

实际上，您可以在标记中完成所有这些操作...这里有一个演示

这是您的标记的变化：

<input type="text" ng-model="search">
<table ng-show="(filteredData = (population.sample | filter:search)) && filteredData.length >= 3 && search && search.length >= 2">
    <tr ng-repeat="person in filteredData">
        <td>{{person.name}}</td>
        <td>{{person.job}}</td>
    </tr>
</table>

编辑：更改了我的答案以反映您的要求。