Disable Filter Sensitive Case on Angular

Question

Disable Filter Sensitive Case on Angular

Navigation

#1 by (1 votes)

0

I have a field in the page that serves to filter a table, but the filter is differentiating capital letters from lowercase letters, and I would like this not to happen, it follows the code:

<tr ng-repeat="participante in listaCadParticipante | filter : filtro">

<input type="text" class="form-control" placeholder="Digite aqui o texto para filtrar" ng-model="filtro" style="height:50px; />

I saw somewhere else to try to put filter : filtro : false but it did not work, if anyone can help me I appreciate

angularjs

asked by anonymous 17.10.2017 / 15:29

1 answer

Sending Image Uploaded to the Direct Server - HIGHCHARTS setOnItemClickListener does not work on custom Adapter

score 1 · Accepted Answer

Just use :false after filtro , documentation says that. In fact, you only need to set false if you want to make this explicit, because it already defaults.

In any case, you can create a function to do the filter work and ensure that it does the case-insensitive comparisons (see the second example).

angular.module('app', []).controller('mainController', function($scope) {
  $scope.listaCadParticipante = [{ nome: 'Jeferson' }, { nome: 'Joaquim' }];
  
  $scope.filtroCs = function(item, index, array) {
    if($scope.filtro2 == undefined)
      return true;
    
    return item.nome.toLowerCase().indexOf($scope.filtro2.toLowerCase()) !== -1;
  };
});

table, th, td {
   border: 1px solid gray;
   margin: 10px;
}

input {
  margin: 10px;
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script><divng-app="app" ng-controller="mainController">

  <input ng-model="filtro" type="text" />
  
  <table>
    <thead>
    </thead>
    <tbody>
      <tr ng-repeat="participante in listaCadParticipante | filter:filtro:false">
        <td> {{ participante.nome }} </td>
      </tr>
    </tbody>
  </table>
  
  <h4>Exemplo usando uma função: </h4>
  
  <input ng-model="filtro2" type="text" />
  
  <table>
    <thead>
    </thead>
    <tbody>
      <tr ng-repeat="participante in listaCadParticipante | filter:filtroCs">
        <td> {{ participante.nome }} </td>
      </tr>
    </tbody>
  </table>

</div>