AngularJS Filtre Caractère générique ou symbole Exclure

En utilisant ng-table puis en filtrant par nom de produit, j'ai besoin d'une recherche "Fantastic Product 01" pour afficher "Fantastic® Product 01" - Le produit n'apparaîtra pas sans l'utilisation de la marque déposée (®) dans l'entrée du filtre.AngularJS Filtre Caractère générique ou symbole Exclure

angular 
    .module('testApp',['ngTable']) 
    .controller('testCtrl', 
    function($scope,$filter,ngTableParams){ 
     $scope.products = [{"name": "Fantastic® Product 01","price":1.99},{"name": "Fantastic® Product 02","price":2.99}]; 
     $scope.productListParams = new ngTableParams({ 
      page: 1, 
      count: $scope.products.length 
     }, { 
      counts: [], 
      total: $scope.products.length, 
      getData: function ($defer, params) { 
       var filteredData = params.filter() ? $filter('filter')($scope.products, params.filter()) : $scope.products; 

       var orderedData = params.sorting() ? 
            $filter('orderBy')(filteredData, params.orderBy()) : filteredData; 

       if (orderedData) { 
        params.total(orderedData.length); 
        $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count())); 
       } else { 
        $defer.reject(); 
       } 
      } 
     }); 
    });

<!DOCTYPE html> 
<html> 
    <head> 
    <!-- ANGULAR --> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.2/angular.min.js"></script> 
    <!-- NG-TABLE --> 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ng-table/0.8.3/ng-table.min.css" /> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/ng-table/0.8.3/ng-table.min.js"></script> 
    </head> 
    <body ng-app="testApp" ng-controller="testCtrl"> 
    <table class="table table-striped" ng-table="productListParams" show-filter="true"> 
     <tbody> 
      <tr ng-repeat="product in $data"> 
       <td data-title="'Name'" sortable="'name'" filter="{ 'name': 'text' }">{{product.name}}</td> 
       <td data-title="'Price'" sortable="'price'" filter="{ 'price': 'number' }">{{product.price | currency}}</td> 
      </tr> 
     </tbody> 
    </table> 
    </body> 
</html>

Plnkr exemple: https://plnkr.co/edit/rAxVan5OnikCIzRDtMIB?p=preview

$filter(?)

Vous cherchez une solution générique (pour travailler avec tous les symboles), par exemple en tapant "Fantastic * produit 01" de retour de résultat mentionné ci-dessus. Ou pour ignorer complètement la marque déposée/les symboles, peut-être remplacés par des espaces blancs.

Source

2017-04-26 Cody

Hope, il travaille pour vous:

angular 
 
    .module('testApp',['ngTable']) 
 
    .controller('testCtrl', 
 
    function($scope,$filter,ngTableParams){ 
 
     $scope.products = [{"name": "Fantastic® Product 01","price":1.99},{"name": "Fantastic® Product 02","price":2.99}]; 
 
     $scope.productListParams = new ngTableParams({ 
 
      page: 1, 
 
      count: $scope.products.length 
 
     }, { 
 
      counts: [], 
 
      total: $scope.products.length, 
 
      getData: function ($defer, params) { 
 
       debugger; 
 
       var filteredData = params.filter() ? $filter('filter')($scope.products, params.filter()) : $scope.products; 
 

 
       for(var i=0;i<filteredData.length;i++){ 
 
        filteredData[i].name=filteredData[i].name.replace(/[^a-zA-Z 0-9]+/g,""); 
 
       } 
 

 
       var orderedData = params.sorting() ? 
 
            $filter('orderBy')(filteredData, params.orderBy()) : filteredData; 
 

 
       //orderedData[0].name=orderedData[0].name.replace(/[^a-zA-Z ], ""); 
 
       if (orderedData) { 
 
        params.total(orderedData.length); 
 
        $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count())); 
 
       } else { 
 
        $defer.reject(); 
 
       } 
 
      } 
 
     }); 
 
    });

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    <!-- ANGULAR --> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.2/angular.min.js"></script> 
 
    <!-- NG-TABLE --> 
 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ng-table/0.8.3/ng-table.min.css" /> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/ng-table/0.8.3/ng-table.min.js"></script> 
 
    </head> 
 
    <body ng-app="testApp" ng-controller="testCtrl"> 
 
    <table class="table table-striped" ng-table="productListParams" show-filter="true"> 
 
     <tbody> 
 
      <tr ng-repeat="product in $data"> 
 
       <td data-title="'Name'" sortable="'name'" filter="{ 'name': 'text' }">{{product.name}}</td> 
 
       <td data-title="'Price'" sortable="'price'" filter="{ 'price': 'number' }">{{product.price | currency}}</td> 
 
      </tr> 
 
     </tbody> 
 
    </table> 
 
    </body> 
 
</html>

Source

2017-04-26 16:32:44

AngularJS Filtre Caractère générique ou symbole Exclure

Répondre

Questions connexes