Question

我下载了一个Angular演示应用程序，通过Angular基础知识学习和工作。我在应用过滤器和排序到数据表时遇到问题。我通过参考一些例子来做到这一点，但不确定它是否正确。

我的表是：

<div class="widget-content" ng-controller="getAllBenchersController">

                <table ng-table="talentPoolList" show-filter="true" class="table table-striped table-bordered">
                    <tr ng-repeat="employee in data | filter: testFilter">

                        <td data-title="'#'">{{$index + 1}}</td>
                        <td data-title="'Employee ID'" sortable="'empno'" filter="{ 'empno': 'text' }">
{{employee.employee.employeeNo}}
</td>
<td data-title="'First Name'" sortable="'employee.employee.firstName'" filter="{ 'employee.employee.firstName': 'text' }">
                            {{employee.employee.firstName}}
                        </td>
  </tr>
                </table>

            </div>

控制器：

myApp.controller('getAllBenchersController', ['$scope', 'employeeTalentPoolServices', function ($scope, employeeTalentPoolServices) {
    employeeTalentPoolServices.getAllBenchers().then(function (result) {
        $scope.data = result.data;
$scope.testFilter = function (item) {
            return (item.state.state.toLowerCase() === 'available' || item.state.state.toLowerCase() === 'blocked');
        }
   });

我不知道它是如何工作的。任何人都可以解释并提供解决方案来解决这个问题吗？

提前致谢

Answer 1

因此，为了解释您的演示示例，我创建了一个类似的示例，让您了解问题中发生的事情。

我们有一个具有不同状态的员工数据，所以当我想显示员工列表时，我只想展示“公平”。并且“好”＆＃39;所以我写了一个传递给filter指令的过滤函数，告诉我应该从列表中显示哪些项目。

如果您观察该功能，它会从列表中获取每个项目并检查状态以匹配所需的状态以进行显示。

查看相同的演示，希望这能让您清楚地了解演示应用中发生的事情。

＆＃13;

var app = angular.module('app',[]);
app.controller('getAllBenchersController',function($scope,$filter){
  
  $scope.data = {employee:[
    
    {'no':1,'name':'max','status':'bad'},
    {'no':2,'name':'fox','status':'good'},
    {'no':3,'name':'juno','status':'bad'},
    {'no':4,'name':'pet','status':'fair'},
    {'no':5,'name':'xyz','status':'good'},
    {'no':6,'name':'shit','status':'bad'},
    {'no':7,'name':'doggy','status':'fair'},
    {'no':8,'name':'hmmm','status':'bad'} 
  ]}
  
  //this test filter is a function which allows me to decide which data should be displayed in this case I've used 'fair' & 'good' status employees to be displayed...
  $scope.testFilter = function (item) {
            return (item.status.toLowerCase() === 'good' || item.status.toLowerCase() === 'fair');
        };
   
  });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" class="widget-content" ng-controller="getAllBenchersController">

                <table>
          <tr ng-repeat="emp in data.employee | filter: testFilter">
                      <td>{{$index+1}} </td>
                      <td> {{emp.no}}</td>
                      <td>{{emp.name}} </td>
  </tr>
                </table>

            </div>

＆＃13;

对Angular表应用排序和过滤器

1 个答案: