Skip to content

Instantly share code, notes, and snippets.

@smorcuend

smorcuend/search.html

Forked from ranakrunal9/search.html
Created September 9, 2019 15:14
Show Gist options
  • Save smorcuend/2e8fbf0b278793b064652d26f85be5f9 to your computer and use it in GitHub Desktop.
Save smorcuend/2e8fbf0b278793b064652d26f85be5f9 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. @ranakrunal9 ranakrunal9 created this gist Nov 18, 2016.
    5 changes: 5 additions & 0 deletions search.html
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,5 @@
    <!-- Pipe Usage in HTML -->
    <input placeholder="keyword..." [(ngModel)]="search"/>
    <div *ngFor="let item of items | searchPipe:'name':search ">
    {{item.name}}
    </div>
    21 changes: 21 additions & 0 deletions search.pipe.ts
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,21 @@
    import { Pipe, PipeTransform } from '@angular/core';

    @Pipe({
    name : 'searchPipe',
    })
    export class SearchPipe implements PipeTransform {
    public transform(value, key: string, term: string) {
    return value.filter((item) => {
    if (item.hasOwnProperty(key)) {
    if (term) {
    let regExp = new RegExp('\\b' + term, 'gi');
    return regExp.test(item[key]);
    } else {
    return true;
    }
    } else {
    return false;
    }
    });
    }
    }