Question

我有一个使用ng-repeat的表来显示一些数据，我有一个输入，允许用户搜索表并根据输入中键入的内容过滤掉结果。我想在屏幕上显示一条消息，说明搜索项目找到了多少结果。现在我只能让它显示所有记录的总数。有没有办法做到这一点？这是我的代码：

<div>
<div>Lookup Results</div>
<div><input type="text" id="searchText" name="searchText" ng-model="query" /></div>

<table ng-if="query" class="table table-hover table-responsive" >
       <thead>     
           <tr>
               <th>
                   {{vm.filteredResults.length}} Results Found
               </th>
           </tr>       
        <tr>
            <td>Acc. ID</td>
            <td>Acc. Name</td>
            <td>Acc Address</td>
            <td>City</td>
            <td>Zip</td>
            <td>Phone</td>
            <td>Parent Name</td>
            <td>Account Type</td>
            <td>Account Status</td>
            <td>Credit Term</td>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="filteredResults = (result in vm.results | filter:query) ">
            <td>{{ result.accountId }}</td>
            <td>{{ result.accountName }}</td>
            <td>{{ result.address }}</td>
            <td>{{ result.city }}</td>
            <td>{{ result.state }}</td>
            <td>{{ reuslt.zip }}</td>
            <td>{{ result.phone }}</td>
            <td>{{ result.parentName }}</td>
            <td>{{ result.accountType }}</td>
            <td>{{ result.accountStatus }}</td>
            <td>{{ result.accountStatus }}</td>
        </tr>
    </tbody>
    <tfoot>
        <tr>
            <td ng-hide="vm.results.length">

Answer 1

当然，您只需要为过滤结果分配一个新属性：

ng-repeat="filteredResults = (result in vm.results | filter:query)"

现在你可以做到：

<td ng-hide="filteredResults.length"></td>

filteredResults将包含过滤后的结果集。

Answer 2

<tr ng-repeat="result in filteredResults = (vm.results | filter: query)">
    <td>{{ result.accountId }}</td>
    <td>{{ result.accountName }}</td>
        ... 
</tr>

Answer 3

最近版本的angular为过滤器添加了返回as：

ng-repeat="result in vm.results | filter:query as filteredResults"

AngularJS在ng-repeat中找到的结果数

3 个答案: