不工作

Question

我正在编写一个代码，可以使用文本框条目搜索表数据。

我的HTML代码如下，

<body ng-app="myModule">
    <div ng-controller="myController">
        <div><input type="text" ng-model="searchText" placeholder="Enter Search Text" /><br><br></div>
        <table>
            <thead>
            <th>Person</th>
            <th>Salary PA</th>
            <th>Date Of Joining</th>
            <th>Programs Completed</th>
            </thead>
            <tbody ng-repeat="person in people|filter:searchText">
            <td>{{person.name|uppercase}}</td>
            <td>{{person.salaryPA|currency}}</td>
            <td>{{person.Doj|date:"MM/dd/yyyy"}}</td>
            <td>{{person.ProgramsCompleted|number}}</td>
            </tbody>
        </table>
    </div>
</body>

Java脚本：

angular.module("myModule", []).controller("myController", functionCall);
function functionCall($scope) {
var people = [{
        name: "Hulk",
        salaryPA: 25000,
        Doj: new Date("March 18, 2014"),
        ProgramsCompleted: 250,
    }, {
        name: "Superman",
        salaryPA: 12000,
        Doj: new Date("March 18, 2014"),
        ProgramsCompleted: 200,
    }, {
        name: "Batman",
        salaryPA: 12500,
        Doj: new Date("January 18, 2014"),
        ProgramsCompleted: 180,
    }];
$scope.people = people;
}

输出：

表格中的第三行没有字符'r'。但是当我用'r'搜索时，过滤器不能正常工作。任何人都可以帮我解决这个问题吗？

由于

Answer 1

对于所有回答的人来说，问题在于角度版本。它工作到1.3 older version并且在latest versions

之后无效

不工作

jsfiddle角度为1.4.0

工作

jsfiddle角度为1.3.9

我仍然需要弄清楚是什么引发了这个问题

Answer 2

我刚刚尝试了您的代码并找到了预期的工作方式。

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="myModule">
    <div ng-controller="myController">
        <div><input type="text" ng-model="searchText" placeholder="Enter Search Text" /><br><br></div>
        <table>
            <thead>
            <th>Person</th>
            <th>Salary PA</th>
            <th>Date Of Joining</th>
            <th>Programs Completed</th>
            </thead>
            <tbody ng-repeat="person in people|filter:searchText">
            <td>{{person.name|uppercase}}</td>
            <td>{{person.salaryPA|currency}}</td>
            <td>{{person.Doj|date:"MM/dd/yyyy"}}</td>
            <td>{{person.ProgramsCompleted|number}}</td>
            </tbody>
        </table>
    </div>
</body>

{{1}}

Answer 3

创建如下的自定义过滤器。这将有效

.filter('SalaryFilter', function() {
  return function(people, searchText) {
    return people.filter(function(person) {
      if (
        person.name.toLowerCase().indexOf(searchText.toLowerCase()) > -1 ||
        person.salaryPA === searchText ||
        person.Doj === new Date(searchText) || 
        person.ProgramsCompleted === searchText
      ) {
        return vendor;
      }
    });
  };
})

Answer 4

这种情况正在发生，因为Doj在3月和1月等月份中包含r。过滤器工作正常。

Answer 5

<强>样本

var app = angular.module('myModule',[]);
app.controller('myController',function($scope) {
    var people = [{
        name: "Hulk",
        salaryPA: 25000,
        Doj: new Date("March 18, 2014"),
        ProgramsCompleted: 250,
    }, {
        name: "Superman",
        salaryPA: 12000,
        Doj: new Date("March 18, 2014"),
        ProgramsCompleted: 200,
    }, {
        name: "Batman",
        salaryPA: 12500,
        Doj: new Date("January 18, 2014"),
        ProgramsCompleted: 180,
    }];
$scope.people = people;
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myModule">
 <div ng-controller="myController">
 <div><input type="text" ng-model="searchText" placeholder="Enter Search Text" /><br><br></div>
        <table>
            <thead>
            <th>Person</th>
            <th>Salary PA</th>
            <th>Date Of Joining</th>
            <th>Programs Completed</th>
            </thead>
            <tbody ng-repeat="person in people|filter:searchText">
            <td>{{person.name|uppercase}}</td>
            <td>{{person.salaryPA|currency}}</td>
            <td>{{person.Doj|date:"MM/dd/yyyy"}}</td>
            <td>{{person.ProgramsCompleted|number}}</td>
            </tbody>
        </table>
 </div>
</div>

搜索过滤器AngularJS

5 个答案:

不工作

工作