title: How to use this pipe in angular 5 dynamically?
body: <p>I am using pipe in my angular Application to filter options values based on search input given by user. This Filter is used at the field level of a form which is dynamically generated using ngFor loop and based on json response. </p>
  
  <p>I am able to use the pipe concept to filter the value for a standalone single input but when I use it multiple times using Ngfor Loop like the below code, It doesn't work perfectly. </p>
  
  <pre><code> // formdata is coming as of json response from a http request
  &lt;div *ngFor="let input1 of formdata.formfields"&gt;   
  
  
   &lt;mat-select placeholder="Select something" [formControlName]="input1.field_name"&gt;
                 &lt;ngx-mat-select-search [(ngModel)]="searchText" [ngModelOptions]="{standalone: true}" placeholder="Select {{input1.title}}"&gt;&lt;/ngx-mat-select-search&gt;
  
                  // here I am using 'fitleroptions' pipe after ngFor and passing searchText ngmodel input binding  
  
               &lt;mat-option *ngFor="let opt_value of input1.enumNameGroups |  filteroptions : searchText; let i = index" value={{input1.value}}&gt;{{opt_value}}&lt;/mat-option&gt;
         &lt;/mat-select&gt;
  
      // other input types like file, text etc....
  
  &lt;/div&gt;
  </code></pre>
  
  <p>This gives me output like this.</p>
  
  <p><a href="https://i.stack.imgur.com/6GuRv.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/6GuRv.png" alt="enter image description here"></a></p>
  
  <p>Now the problem is that searchText assigned to ngmodel can not be used more then once as it is bounded to only one input and if I do so, it is affecting the other inputs also. </p>
  
  <p>How to pass [(ngmodel)] ="some_variable" and then assign it to   filteroptions : "some_variable" so that they are bounded to only one selection input???</p>
  
  <p>So the problem can be also expressed as how to pass dynamic ngmodel name and assign that name to  pipe parameters ? </p>
  
  <p>This is the filteroptions pipe I am using .</p>
  
  <pre><code>import { Pipe, PipeTransform } from '@angular/core';
  @Pipe({
    name: 'filteroptions'
  })
  export class FilterOptionsPipe implements PipeTransform {
    transform(items: any[], searchText: string): any[] {
      if(!items) return [];
      if(!searchText) return items;
  searchText = searchText.toLowerCase();
  return items.filter( it =&gt; {
  
          console.log("got item array here",items);
       return it.toLowerCase().includes(searchText);
      });
     }
  }
  </code></pre>