2016-08-19 3 views
1

私はAngularJSで小さなフィルタアプリケーションを作成しました。これは、文字を入力すると、その文字が入っているテーブルのすべてが見つかるように機能します。たとえば、「s」と入力すると、すべての名前に「s」が含まれます。なぜ文字「m」のような手紙が全く働かないのですか?誰かがこれを変更する方法を教えてもらえますか?どうもありがとう。私のソートフィルタは、文字 "m?"以外のすべてに対して機能します。

HTML

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <title>The Sort Filter</title> 
    <link href="content/css/styles.css" rel="stylesheet" type="text/css" /> 
    <script src="app\lib\angular.min.js"></script> 
    <script src="app\app.js"></script> 

    </head> 
    <body ng-app="myApp"> 
    <div ng-controller="myController"> 
     <input type="text" ng-model="search" /> 
     <table> 
      <thead> 
       <tr> 
        <th>Firstname</th> 
        <th>Lastname</th> 
        <th>Gender</th> 
        <th>Salary</th> 
       </tr> 
      </thead> 
      <tbody> 
       <tr ng-repeat="employee in employees | orderBy: 'lastName' | filter: search"{{employee.lastName}}"> 
        <td>{{ employee.firstName}}</td> 
        <td>{{ employee.lastName}}</td> 
        <td>{{ employee.gender}}</td> 
        <td>{{ employee.salary}}</td> 
       </tr> 
      </tbody> 
     </table> 
    </div> 
    </body> 
</html> 

JS

angular.module("myApp", []) 
    .controller("myController", function ($scope) { 
     //array of objects 
     {var employees = [ 
{firstName: "David", lastName: "Hastings", gender: "Male", salary: 55000}, 
{firstName: "Sarah", lastName: "Smith", gender: "Female", salary: 56000}, 
{firstName: "Mark", lastName: "Schydinger", gender: "Male", salary: 45000}, 
{firstName: "Pam", lastName: "Yerace", gender: "Female", salary: 70000}, 
{firstName: "Todd", lastName: "Barber", gender: "Male", salary: 50000}, 
{firstName: "Maria", lastName: "Randall", gender: "Female", salary: 59000}, 
{firstName: "Amanda", lastName: "Quinn", gender: "Female", salary: 68000}, 
{firstName: "James", lastName: "Stewart", gender: "Male", salary: 62000}, 
{firstName: "Rachel", lastName: "Dowd", gender: "Female", salary: 57000}, 
{firstName: "Keith", lastName: "Cameron", gender: "Male", salary: 56500}, 
{firstName: "Carol", lastName: "Marshall", gender: "Female", salary: 62000}, 
{firstName: "Peter", lastName: "Buckland", gender: "Male", salary: 60000}, 
{firstName: "Diana", lastName: "Murray", gender: "Female", salary: 73000}, 
{firstName: "Dylan", lastName: "Hamilton", gender: "Male", salary: 61000}, 
{firstName: "Caroline", lastName: "Clark", gender: "Female", salary: 62000}, 
{firstName: "Cletus", lastName: "Bones", gender: "Male", salary: 60000}, 
{firstName: "Judy", lastName: "Charleton", gender: "Female", salary: 64000} 
]}; 
$scope.employees = employees; 

     }); 
+0

あなたは 'のようなコレクションの特定のプロパティまたは単に単一のプロパティにフィルタを作りたかったですfirstName'/'lastName'? –

+0

jsfiddleを作成してください:) – Chris

+0

私はファーストネームまたはラストネームから文字を入力して結果を得ることができるようにしたいと思います。 –

答えて

2

これは、実際に働いています。 "m"は "Male"と "Female"のためにすべてのデータを返します。姓と名のみでフィルタリングする場合は、独自のカスタムフィルタを作成する必要があります。

<tr ng-repeat="employee in employees | orderBy: 'lastName' | myFilter: search"> 

とフィルタ:ビューで

https://jsfiddle.net/fa0coq4e/

:たとえば

filter('myFilter', function() { 
    return function(array, search) {  
    if (search !== undefined && search.length > 0) {   
     var new_array = [];   
     for (var i = 0; i < array.length; i++) { 
     if (array[i].firstName.toLowerCase().indexOf(search.toLowerCase()) > -1 
     || array[i].lastName.toLowerCase().indexOf(search.toLowerCase()) > -1) 
      new_array.push(array[i]); 
     }   
     return new_array; 
    } else { 
     return array; 
    } 
}}); 
+0

ハ、 "男性/女性" - 私はそれを考えていたはずです。ありがとうございました。 –

関連する問題