I have the following code where i'm trying to filter on the product array by checking a checkbox,but in my case list is not filtered click on the checkbox,i have set the value of city in the value of the checkbox,but list is not filtered?
//here we create the product array and display the array in the HTML page.
var app=angular.module("myApp",[]);
app.controller("myCont",function($scope){
var product = [
{pid:"110",ename:"Harry",esalary:"25000",ecity:"Agar"},
{pid:"109",ename:"potter",esalary:"11000",ecity:"US"},
{pid:"101",ename:"Peter",esalary:"1200",ecity:"London"},
{pid:"104",ename:"Janifer",esalary:"12000",ecity:"Bejing"},
{pid:"103",ename:"Selena",esalary:"35000",ecity:"England"},
{pid:"102",ename:"Lokesh",esalary:"32500",ecity:"Malwa"},
{pid:"108",ename:"Gotm",esalary:"8910",ecity:"Ujain"},
{pid:"106",ename:"Soni",esalary:"16000",ecity:"bhopal"},
{pid:"110",ename:"Harry",esalary:"25000",ecity:"Agar"},
{pid:"109",ename:"potter",esalary:"11000",ecity:"US"},
{pid:"101",ename:"Peter",esalary:"1200",ecity:"London"},
{pid:"104",ename:"Janifer",esalary:"12000",ecity:"Bejing"}
]
$scope.products=product;
});
<html>
<head>
<script src="angular.min.js"></script>
<link rel="stylesheet" type="text/css" href="bootstrap.min.css">
<script src="controller.js"></script>
</head>
<style>
#count
{
color: blue;
}
#search
{
background-color: LightBlue;
}
</style>
<div class="funkyradio">
<div class="funkyradio-default">
<input type="checkbox" Agar/>
<label for="checkbox1">First Option default</label>
</div>
<div class="funkyradio-primary">
<input type="checkbox" data-ng-model='search.type1' data-ng-true-value="'US'" data-ng-false-value=''/>US
<label for="checkbox2">Second Option primary</label>
</div>
</div>
</div>
<body ng-app="myApp" ng-controller="myCont">
<form align="center">
//Search tab for all array
Search Here<input type="text" name="uname"
ng-model="search" placeholder=" Enter data">
Hide Salary <input type="checkbox" ng-model="hideSalary">
<table class="table table-hover" align="center" border="2">
<thead id="search">
<tr>
<th>pid</th>
<th>ename</th>
<th ng-hide="hideSalary">esalary</th>
<th>
ecity
</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="x in filtered = (products | filter:search) | filter:search.type1 | orderBy:'ename'">
<td></td>
<td></td>
<td ng-hide="hideSalary"></td>
<td></td>
</tr>
</tbody>
</table>
<span id="count">
<hr>
Filtered list has items
</span>
</form>
</body>
</html>
Aucun commentaire:
Enregistrer un commentaire