projects/i-components/src/lib/pipes/autocomplete.pipe.ts
Pipe to filter items in the AutoCompleteBox itemsSource list.
Name | filter |
Private Static getFunctionToTest | ||||||
getFunctionToTest(filterMode: string)
|
||||||
Parameters :
Returns :
boolean
|
Private Static getValueToDisplay |
getValueToDisplay(item: any, valueMember: string, valueMemberBinding: string)
|
Returns :
any
|
Public transform | |||||||||||||||||||||||||||||||||||
transform(collection: any[], term: string, filterMode: string, valueMember: string, valueMemberBinding: string, customFilter: (search: any,item: any) => void)
|
|||||||||||||||||||||||||||||||||||
Filter out the elements of the given collection. "StartsWithCaseSensitive", "StartsWithOrdinalCaseSensitive", "Contains", "ContainsOrdinal", "ContainsCaseSensitive", "ContainsOrdinalCaseSensitive", "Equals","EqualsOrdinal", "EqualsCaseSensitive", "EqualsOrdinalCaseSensitive", "Custom", "None"]
Parameters :
Returns :
any
a collection with the elements matching the given filter. |
import { Pipe, PipeTransform } from '@angular/core';
/**
* Pipe to filter items in the AutoCompleteBox itemsSource list.
*
* @export
* @class AutocompletePipeFilter
* @implements {PipeTransform}
*/
@Pipe({ name: 'filter' })
export class AutocompletePipeFilter implements PipeTransform {
private static getFunctionToTest(
filterMode: string
): (
term: string,
itemToTest: string,
item: any,
customFilter: (search: any, item2: any) => boolean
) => boolean {
switch (filterMode) {
case 'StartsWith':
case 'StartsWithOrdinal':
return (term: string, itemToTest: string, item: any) =>
itemToTest
.toString()
.toLowerCase()
.startsWith(term.toString().toLowerCase());
case 'StartsWithCaseSensitive':
case 'StartsWithOrdinalCaseSensitive':
return (term: string, itemToTest: string, item: any) =>
itemToTest.toString().startsWith(term.toString());
case 'Contains':
case 'ContainsOrdinal':
return (term: string, itemToTest: string, item: any) =>
itemToTest
.toString()
.toLowerCase()
.includes(term.toString().toLowerCase());
case 'ContainsCaseSensitive':
case 'ContainsOrdinalCaseSensitive':
return (term: string, itemToTest: string, item: any) =>
itemToTest.toString().includes(term.toString());
case 'Equals':
case 'EqualsOrdinal':
return (term: string, itemToTest: string, item: any) =>
itemToTest.toString().toLowerCase() === term.toString().toLowerCase();
case 'EqualsCaseSensitive':
case 'EqualsOrdinalCaseSensitive':
return (term: string, itemToTest: string, item: any) =>
itemToTest.toString() === term.toString();
case 'Custom':
return (
term: string,
itemToTest: string,
item: any,
customFilter: (search: any, item2: any) => boolean
) => customFilter(term, item);
case 'None':
default:
return (term: string, itemToTest: string, item: any) => true;
}
}
private static getValueToDisplay(
item: any,
valueMember: string,
valueMemberBinding: string
): any {
if (valueMemberBinding) {
return item[valueMemberBinding];
} else {
return valueMember ? item[valueMember] : item;
}
}
/**
* Filter out the elements of the given collection.
*
* @param collection The collection with the elements to filter
* @param term The pattern to apply
* @param filterMode The kind of filter to apply. One of ["StartsWith", "StartsWithOrdinal",
* "StartsWithCaseSensitive", "StartsWithOrdinalCaseSensitive", "Contains", "ContainsOrdinal",
* "ContainsCaseSensitive", "ContainsOrdinalCaseSensitive", "Equals","EqualsOrdinal",
* "EqualsCaseSensitive", "EqualsOrdinalCaseSensitive", "Custom", "None"]
* @param valueMember a string indicating the member of the collection item to test for (collection[0][valueMember] for instance) or null
* @param valueMemberBinding a {link Binding} object used to solve the value of the item to test for or null
* @param customFilter a custom function used when filterMode is "Custom". Items are validated by calling given function.
* @returns a collection with the elements matching the given filter.
*/
public transform(
collection: any[],
term = '',
filterMode: string,
valueMember: string,
valueMemberBinding: string,
customFilter: (search: any, item: any) => boolean
) {
if (collection?.filter && term != null) {
const functionToTest =
AutocompletePipeFilter.getFunctionToTest(filterMode);
return collection.filter((item) => {
const itemToTest = AutocompletePipeFilter.getValueToDisplay(
item,
valueMember,
valueMemberBinding
);
if (!itemToTest && filterMode !== 'Custom') {
return false;
}
return functionToTest(term, itemToTest, item, customFilter);
});
}
return [];
}
}