Pessoal estou com uma dificuldade em desenvolver um filtro de uma tabela que possui os campos name
e price
. Gostaria de filtrar um respectivo preço com as seguintes condições:
- = (igual)
- > (maior)
- < (menor)
Segue abaixo um código simplificado como referência:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>
<div ng-app="myApp" ng-controller="namesCtrl">
<div class="container">
<div class="row"></div>
<div class="row">
<div class="col-lg-4 col-md-offset-4">
<div class="input-group">
<input type="text" class="form-control" ng-model="test" placeholder="Pesquisa por valor igual">
<span class="input-group-addon">=</span>
</div>
<div class="input-group">
<input type="text" class="form-control" ng-model="test" placeholder="Pesquisa por valor menor">
<span class="input-group-addon"><</span>
</div>
<div class="input-group">
<input type="text" class="form-control" ng-model="test" placeholder="Pesquisa por valor maior">
<span class="input-group-addon">></span>
</div>
<table class="table table-striped">
<tr>
<th>Nome</th>
<th>Valor</th>
</tr>
<tr ng-repeat="x in names | filter: test">
<td>{{x.name}}</td>
<td>{{x.price | currency}}</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<script>
angular.module('myApp', []).controller('namesCtrl', function ($scope) {
$scope.names = [
{name:'Joao', price:3.50},
{name:'Maria', price:4.60},
{name:'Pedro', price:7.90},
{name:'Miguel', price:1.20},
];
});
</script>
</body>
</html>
Alguém poderia me ajudar?