title: Create custom pipe that is async by itself
body: <p>I've created a custom pipe that retrieves bits of textual content from an API, like this:</p>
  <pre class="lang-typescript prettyprint-override"><code>@Pipe({ name: 'apiText' })
  export class ApiTextPipe implements PipeTransform {
    constructor(private myApiService: MyApiService) {
    }
  
    transform(key: string): Observable&lt;string&gt; {
      return this.myApiService.getText(key);
    }
  }
  </code></pre>
  <p>I have to use it like this:</p>
  <pre class="lang-html prettyprint-override"><code>&lt;strong&gt;{{'some-key' | apiText | async}}&lt;/strong&gt;
  </code></pre>
  <p>But effectively I will <em>always</em> want to combine the <code>apiText</code> and <code>async</code> pipes. I'd prefer to write this:</p>
  <pre class="lang-html prettyprint-override"><code>&lt;strong&gt;{{'some-key' | apiTextAsync}}&lt;/strong&gt;
  </code></pre>
  <p>Can I do that somehow, and make things a bit more DRY by combining the two pipes?</p>
  <hr />
  <p><strong>UPDATE 1</strong>: I've <a href="https://github.com/angular/angular/issues/32368" rel="noreferrer">opened a GitHub issue</a> as a feature request for a solution for this.</p>
  <p><strong>UPDATE 2</strong>: The issue was closed because <a href="https://github.com/angular/angular/issues/32368#issuecomment-527672368" rel="noreferrer">the async pipe &quot;is not special&quot; and &quot;nothing prevents you from writing one that is similar</a> ‍♂️</p>