2015-06-03 14 views
6

Nella mia app utilizzo una griglia utente UI angolare. Ho impostato enableFiltering su true nelle opzioni che mostravano alcune caselle filtro sopra le mie colonne. Questo è fantastico, ma i filtri non funzionano esattamente come desiderato.Il filtro griglia UI angolare si applica solo all'inizio del valore della cella

Se una cella contiene il testo "Mi piace la pizza" e digito "Mi piace", la riga della cella viene visualizzata come corrispondenza. Vorrei anche pensare che se digito "pizza", la cella/riga "I like pizza" dovrebbe apparire, ma non è questo il caso.

Come posso ottenere i filtri per consentire la ricerca in qualsiasi parte del testo, non solo dall'inizio?

+0

Il valore predefinito è 'STARTS_WITH', ma si può cambiare: https://github.com/angular-ui/ng-grid/issues/2839 –

+0

@BradBarber sembra la cosa esatta che voglio, anche se non è chiaro come usarlo. Qualche idea? –

+0

Nel columnDef in cui si desidera utilizzarlo, si aggiungerà quanto segue: 'filter: {condizione: uiGridConstants.filter.CONTAINS}' –

risposta

5

È possibile utilizzare filter: {condition: uiGridConstants.filter.CONTAINS} nella definizione della colonna per consentire quella colonna di cercare in qualsiasi parte del testo.

Ecco una definizione di colonna di esempio con questo posto:

columnDefs: [ 
    // default 
    { field: 'name', 
    filter: {condition: uiGridConstants.filter.CONTAINS} }, 
    ... 
+2

BTW, lettore, non dimenticare di includere 'uiGridConstants' nell'iniezione delle dipendenze. –

+0

C'è un vantaggio in questo rispetto alla scrittura di una funzione? – azium

+1

@azium, preferisco utilizzare qualsiasi funzionalità fornita da un framework se è disponibile ... di solito lo implementano meglio di quanto vorrei. In questo caso hanno implementato il filtro CONTAINS con una regex invece di indexOf che ritengo sia un po 'più veloce (https://github.com/angular-ui/ng-grid/blob/master/src/js/core/services/ rowSearcher.js # L149). –

1

È possibile passare un oggetto filtro personalizzato che accetta una proprietà condition, che può essere una funzione che richiede searchTerm e cellValue. Verrà visualizzato se la funzione restituisce true. Plunkr

{ field: 'name', filter: { 
    condition: function(searchTerm, cellValue) { 
     return cellValue.indexOf(searchTerm) > -1 
    } 
    }} 
+0

BTW, anche se non pensavo che questo fosse il modo migliore per realizzare ciò che ero originariamente dopo, questo codice mi è stato di aiuto in un modo diverso più tardi, quindi grazie. –

Problemi correlati