Angularjsのカスタムフィルタが動作しません

Question

私はAngularjsでカスタムフィルタを実装しようとしています。しかし、私はそれの問題が何かを得ていない。期待どおりの出力が得られません。ここに私のコードは次のとおりです。

script.js

var myApp = angular.module('myModule', []); 
myApp.filter("gender", function(){ 
    return function(gender){ 
    switch(gender){ 
     case 1 : return 'Male'; 
     case 2 : return 'Female'; 
    } 
    } 
}); 

myApp.controller('myController', function($scope){ 
var employees = [ 
    { name : 'Raghu', gender : '1', salary : 84000.779 }, 
    { name : 'Anil', gender : '1', salary : 78000 }, 
    { name : 'Ramya', gender : '2', salary : 118000 }, 
    { name : 'Shwetha', gender : '2', salary : 68000 }, 
    { name : 'Chethan', gender : '1', salary : 168000 } 
]; 
$scope.employees = employees; 

}）;

page.html

<div class="container" ng-controller="myController"> 
     <h1>Angular Example Ten</h1> 
     <table class="table"> 
      <thead> 
       <tr> 
        <th>Name</th> 
        <th>Gender</th> 
        <th>Salary</th> 
       </tr> 
      </thead> 
      <tbody> 
       <tr ng-repeat="employee in employees"> 
        <td>{{ employee.name }}</td> 
        <td>{{ employee.gender | gender }}</td> 
        <td>{{ employee.salary }}</td> 
       </tr> 
      </tbody> 
     </table> 
    </div> 

Answer 1

変更する文字列値に数値例：

case '1' : return 'Male'; 
case '2' : return 'Female'; 

1 !== "1"ので。

console.log('1 !== "1" ::::', 1 !== "1"); // true

Answer 2

変更する文字列値に数値例：

switch(gender){  
    case '1' : return 'Male'; 
    case '2' : return 'Female'; 
default: return 'Male'; 
} 

あなたは、文字列にそれを変換しても、デフォルトの結果を持っている必要があります。

AngularJS Filter

Answer 3

あなたが渡している数は、文字列ではない整数です。文字列にスイッチケース番号を変更

switch(gender){ 
     case "1" : return 'Male'; 
     case "2" : return 'Female'; 
    } 

var myApp = angular.module('myModule', []); 
 
myApp.filter("gender", function(){ 
 
    return function(gender){ 
 
    debugger 
 
    switch(gender){ 
 
     case "1" : return 'Male'; 
 
     case "2" : return 'Female'; 
 
    } 
 
    } 
 
}); 
 

 
myApp.controller('myController', function($scope){ 
 
var employees = [ 
 
    { name : 'Raghu', gender : '1', salary : 84000.779 }, 
 
    { name : 'Anil', gender : '1', salary : 78000 }, 
 
    { name : 'Ramya', gender : '2', salary : 118000 }, 
 
    { name : 'Shwetha', gender : '2', salary : 68000 }, 
 
    { name : 'Chethan', gender : '1', salary : 168000 } 
 
]; 
 
$scope.employees = employees; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div class="container" ng-app="myModule" ng-controller="myController"> 
 
     <h1>Angular Example Ten</h1> 
 
     <table class="table"> 
 
      <thead> 
 
       <tr> 
 
        <th>Name</th> 
 
        <th>Gender</th> 
 
        <th>Salary</th> 
 
       </tr> 
 
      </thead> 
 
      <tbody> 
 
       <tr ng-repeat="employee in employees"> 
 
        <td>{{ employee.name }}</td> 
 
        <td>{{ employee.gender | gender }}</td> 
 
        <td>{{ employee.salary }}</td> 
 
       </tr> 
 
      </tbody> 
 
     </table> 
 
    </div>