[英]Custom filter in Angularjs not working
我正在嘗試在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>
將數字大小寫更改為字符串值:
case '1' : return 'Male';
case '2' : return 'Female';
因為1 !== "1"
。
console.log('1 !== "1" ::::', 1 !== "1"); // true
傳遞的數字是字符串而不是整數。 將開關案例編號更改為字符串
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>
將數字大小寫更改為字符串值:
switch(gender){
case '1' : return 'Male';
case '2' : return 'Female';
default: return 'Male';
}
您應該將其轉換為字符串,並且還具有默認結果。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.