title: Angular 4: Ng2SearchPipeModule using this module for the search. Not working properly on the Data in Numeric
body: <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import { Injectable } from '@angular/core';
  import { IFavContactSchema } from './favSchema';
  @Injectable({
    providedIn: 'root'
  })
  export class FavContactServiceService {
    allContactDetails:IFavContactSchema[] = [
      {
        first_name:"neha",middle_name:"singh",last_name:"sengar",email:"neha.singh931126@gmail.com",mobile_number:9898989898,phone_number:8989898989,notes:"Add to my faver",calling_rate:"frequent"
      },
      {
        first_name:"sonal",last_name:"trivedi",email:"sonal.trivedi@gmail.com",mobile_number:9092312345,phone_number:8989898989,notes:"Add to my onme",calling_rate:"frequent"
      },
      {
        first_name:"oshin",last_name:"sharma",email:"oshin.sharma@gmail.com",mobile_number:9522335434,phone_number:8989898989,notes:"Add to my tow",calling_rate:"frequent"
      },
      {
        first_name:"karasadn",last_name:"sdasd",email:"karan.veer@gmail.com",mobile_number:8839367967,phone_number:8989898989,notes:"Add to my three",calling_rate:"non_frequent"
      },
      {
        first_name:"kunil",last_name:"sharma",email:"kanul.sharma@gmail.com",mobile_number:9097854322,phone_number:8989898989,notes:"Add to my four",calling_rate:"frequent"
      },
      {
        first_name:"kane",last_name:"jain",email:"ranie.jain@gmail.com",mobile_number:8989673422,phone_number:8989898989,notes:"Add to my five",calling_rate:"frequent"
      },
      {
        first_name:"sane",last_name:"sharma",email:"punit.deer@gmail.com",mobile_number:9000000000,phone_number:8989898989,notes:"Add to my six",calling_rate:"non_frequent"
      },
    ];
    constructor() { }
  
    addContacts(details:IFavContactSchema){
        this.allContactDetails.push(details);
        return "Data Added Successfully";
    }
    
    getAllContacts(){
        return this.allContactDetails;
    }
    
    deleteContact(i){
      this.allContactDetails.splice(i, 1);
    }
  
    getContact(i){
      return this.allContactDetails[i];
    }
  
    updateContact(i,updatedContact){
      this.allContactDetails[i] = updatedContact;
    }
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>TS
  import { Component, OnInit } from '@angular/core';
  import { IFavContactSchema } from '../favSchema';
  import { FavContactServiceService } from '../fav-contact-service.service';
  @Component({
    selector: 'app-favourites-list',
    templateUrl: './favourites-list.component.html',
    styleUrls: ['./favourites-list.component.css']
  })
  export class FavouritesListComponent implements OnInit {
    key: string = 'first_name'; //set default
    reverse: boolean = false;
    p: number = 1;
    favContactLists:IFavContactSchema[];
    constructor(private favConService:FavContactServiceService) { }
    ngOnInit() {
      this.favContactLists = this.favConService.getAllContacts();
  
    }
    deleteContact(i:Number){
      this.favConService.deleteContact(i);
    }
    sort(key){
      this.key = key;
      this.reverse = !this.reverse;
    }
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>HTML
  &lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
    &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
    &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;div class="container"&gt;
    &lt;h2&gt;Fav Contacts&lt;/h2&gt;
    &lt;nav class="navbar"&gt;
        &lt;input class="form-control" type="text" name="search" [(ngModel)]="filter"&gt;      
    &lt;/nav&gt;
    &lt;table class="table"&gt;
      &lt;thead&gt;
        &lt;tr&gt;
          &lt;th&gt;#&lt;/th&gt;
          &lt;th (click)="sort('first_name')"&gt;Name
              &lt;span class="glyphicon sort-icon" *ngIf="key =='name'" [ngClass]="{'glyphicon-chevron-up':reverse,'glyphicon-chevron-down':!reverse}"&gt;&lt;/span&gt;
          &lt;/th&gt;
          &lt;th (click)="sort('email')"&gt;Email&lt;/th&gt;
          &lt;th (click)="sort('calling_rate')"&gt;Calling Rate&lt;/th&gt;
          &lt;th (click)="sort('mobile_number')"&gt;Mobile Number&lt;/th&gt;
          &lt;th&gt;Actions&lt;/th&gt; 
         &lt;/tr&gt;
      &lt;/thead&gt;
      &lt;tbody *ngIf="favContactLists?.length &gt; 0; else no_record"&gt;
        &lt;tr *ngFor="let contact of favContactLists| filter:filter | orderBy: key : reverse| paginate: { itemsPerPage: 5, currentPage: p };let i=index"&gt;
          &lt;td&gt;{{ i+1 }}&lt;/td&gt;
          &lt;td&gt;{{ contact.first_name  + " " }}{{contact.middle_name ? contact.middle_name : ""}}{{ " " + contact.last_name }}&lt;/td&gt;
          &lt;td&gt;{{ contact.email }}&lt;/td&gt;
          &lt;td *ngIf="contact.calling_rate == 'frequent'; else non_frequent" &gt;{{ "Frequent" }}&lt;/td&gt;
          &lt;ng-template #non_frequent&gt;&lt;td&gt;{{ "Non Frequent" }}&lt;/td&gt;&lt;/ng-template&gt;
          &lt;td &gt;{{ contact.mobile_number }}&lt;/td&gt;
          &lt;td&gt;&lt;a [routerLink]="['/edit', i+1]"&gt;
                  &lt;span class="glyphicon glyphicon-pencil"&gt;&lt;/span&gt;
              &lt;/a&gt;
              &lt;a (click) = "deleteContact(i)"&gt;
                  &lt;span class="glyphicon glyphicon-trash"&gt;&lt;/span&gt;
              &lt;/a&gt;
          &lt;/td&gt;
         &lt;/tr&gt;
        
      &lt;/tbody&gt;
      &lt;ng-template #no_record&gt;
        &lt;tbody&gt;
          &lt;td colspan="5" class="active cen" align="center"&gt;No Record Found&lt;/td&gt;
        &lt;/tbody&gt;
      &lt;/ng-template&gt;
      &lt;pagination-controls (pageChange)="p = $event"&gt;&lt;/pagination-controls&gt;
    &lt;/table&gt;
  &lt;/div&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I am new to Angular facing a small issue.
  Using the Ng2SearchPipeModule for the search It is working fine for the Data in string but not with the data in Number. I am attaching the Screenshot below...</p>
  
  <p>For some search scenario working fine but for some not.
  Please Help.</p>
  
  <p>There are two images one with the normal search and one in which all the records are there even if it doesnot match the filtering criteria</p>