title: How to use custom pipe on async pipe?
body: <p>I'm trying to create custom pipe on asynchronous pipe, I tried many solutions, but still not working. Here is the snippet of code.</p>
  
  <p><strong>product.sort.ts - custom pipe</strong></p>
  
  <pre class="lang-ts prettyprint-override"><code>import { PipeTransform, Pipe } from '@angular/core';
  import { Observable } from 'rxjs/Observable';
  
  @Pipe({
      name: 'sortByName'
  })
  export class ProductPipe implements PipeTransform{
      /*transform(values: Array&lt;any&gt;, term:string){
          return values.filter(obj =&gt; obj.pname.startsWith(term))
      }*/
  
      //CODE NOT WORKING &gt;&gt;&gt;&gt;&gt;
      transform($value: Observable&lt;Array&lt;any&gt;&gt;, term:string){
          if($value){
              $value.subscribe(
                  (obj) =&gt; {
                      return obj.filter(obj =&gt; obj.pname.startsWith(term))
                  }
              )
          }
      }
  }
  </code></pre>
  
  <p><strong>products.component.ts - main component</strong></p>
  
  <pre class="lang-ts prettyprint-override"><code>import { Component, OnInit } from '@angular/core';
  import { Store } from '@ngrx/store';
  import { Observable } from 'rxjs/Observable';
  import { AppService } from '../app.service/app.service';
  import { ProductPipe } from '../products.sort/products.sort';
  
  @Component({
      selector: 'products-pg',
      template: `
          Products List:
          &lt;ul&gt;
              &lt;li *ngFor = 'let product of $productList | async | sortByName:"A"'&gt;{{product.pname}}&lt;/li&gt;
          &lt;/ul&gt;
      `
  })
  export class ProductsComponent implements OnInit{
      private $productList:Observable&lt;Array&lt;any&gt;&gt;;
  
      constructor(private _service: AppService, private _store: Store&lt;Array&lt;any&gt;&gt;){}
  
      ngOnInit(){
          this._service.setProductList();
          this.$productList = this._store.select('products');
      }
  }
  </code></pre>
  
  <p>Here, I'm using store for state management, I'm trying to sort by name, so passing "A" as first letter. Since <strong>$productList</strong> is observable, how to write pipe which handles asynchronous behavior like this, plase help me to solve this.  </p>