title: Angular 5 ERROR TypeError: Cannot read property 'toLowerCase' of undefined
body: <p>I got this error on my chrome's console :</p>
  
  <blockquote>
    <p>ERROR TypeError: Cannot read property
    'toLowerCase' of undefined</p>
  </blockquote>
  
  <p>On DashboardComponent.html:5 :</p>
  
  <pre><code>&lt;div class="mdl-grid center-items"&gt;
    &lt;div class="mdl-cell mdl-cell--4-col"&gt;
        &lt;mat-form-field class="search-form-field"&gt;
            &lt;input matInput type="text" name="searchCompany" placeholder="Search" [(ngModel)]="searchCompany"/&gt;
            &lt;button *ngIf="searchCompany" matSuffix mat-icon-button aria-label="Clear" (click)="searchCompany=''"&gt;
              &lt;mat-icon&gt;close&lt;/mat-icon&gt;
            &lt;/button&gt;
        &lt;/mat-form-field&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>This is my CompanyFilterPipe class :</p>
  
  <pre><code>import { PipeTransform, Pipe } from "@angular/core";
  import { Company } from "../../models/company.model";
  
  @Pipe({
      name : 'companyFilter'
  })
  export class CompanyFilterPipe implements PipeTransform{
      transform(companies:Company[], searchCompany:String) : Company[]{
          const value = searchCompany.toLowerCase();
          if(!companies == !searchCompany){
              return companies;
          }
          return companies.filter(companies =&gt; companies.perusahaan.toLowerCase().indexOf(value) !== -1);
      }
  
  }
  </code></pre>
  
  <p>I have declare the CompanyFilterPipe on app.module.ts, but it's not work as well, how I can fix this? Thank you.</p>