TreacleMark
TreacleMark

Reputation: 163

Angular Unordered Sentence Search

In my code, I have a search bar and I'm trying filter elements of a list according to what I have written. The filter works fine if I search the element in an order. For example, if I search 'red blue yellow' like 'red blue' but, I want the filter work when I search it as 'red yellow' too. Here is my code, what should I add to achieve what I want?

HTML:

<input matInput (keyup)="applyFilter($event.target.value)" placeholder="Filter">

TS:

dataSource: MatTableDataSource<IProduct>;
@ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
@ViewChild(MatSort, { static: true }) sort: MatSort;

filterPredicate(data: IProduct, filter: string) {
    let fullText = "";

    fullText += data.StockIntegrationCode;
    fullText += data.ProductGroup ? data.ProductGroup.GroupName : "";
    fullText += data.ProductCategory
        ? data.ProductCategory.CategoryName
        : "";
    fullText += data.ProductName;
    fullText += data.Description;
    fullText += data.UnitType ? data.UnitType.Name : "";
    fullText += data.IsActive ? "Aktif" : "Taslak";

    return (fullText as any).toLocaleLowerCase("tr").indexOf(filter) >= 0;
}

    applyFilter(filterValue: string) {
        if (this.dataSource) {
            this.dataSource.filter = filterValue.trim().toLocaleLowerCase();
            if (this.dataSource.paginator) {
                this.dataSource.paginator.firstPage();
            }
        }
    }

Upvotes: 0

Views: 111

Answers (1)

Eliseo
Eliseo

Reputation: 57981

Imagine you can use

fullText=fullText.loLocaleLowerCase("tr")
return filter.split(' ').filter(x=>(fullText.indexOf(x)<0)).length==0

That, split your "filter", then you has, e.g. ["red","yellow"] and filter the array only the elements that it's NOT in the fullText.

If there're none (length==0) is because all are in the fulltext.

NOTE: I write the fullText=fullText.loLocaleLowerCase("tr") to not repeat for each "word" in your filter.

Upvotes: 1

Related Questions