title: Getting return value from angular custom pipe before service return value
body: <p>I am trying to create a custom pipe for getting likes on particular post, it has a service which connects to database and pull all likes related to particular post, but when i try to run in my code, i am getting return value before the getting response from service, i know i should wait for the response but not sure how to do that.. please help me resolve this issue.</p>
  
  <p><strong>HTML page</strong></p>
  
  <pre><code> &lt;a [ngClass]="{'like': toggle, 'dislike': !toggle}" (click)="addremovecomment($event, mainpost)" class="float-right btn-sm text-black btn mr-1 dislike"&gt;&lt;span&gt;&lt;i class="fa fa-heart" style="color: dislike;"&gt;&lt;/i&gt;&lt;/span&gt;&lt;label class="ml-1" id="lbl{{mainpost.id}}"&gt;{{mainpost | like }}&lt;/label&gt;&lt;/a&gt;
  </code></pre>
  
  <p><strong>Service</strong></p>
  
  <pre><code>      getalllikes(post: MainPost): Observable&lt;any&gt; {
      return this.http.post&lt;any&gt;(this.baseUrl + 'GetLikes', post);
    }
  </code></pre>
  
  <p><strong>Pipe</strong></p>
  
  <pre><code>import { Pipe, PipeTransform } from '@angular/core';
  import { MainPost } from '../_models';
  import { LikesService } from '../_services';
  import { retry } from 'rxjs/operators';
  
  @Pipe({
    name: 'like'
  })
  export class LikePipe implements PipeTransform {
    postlikes = 0;
    constructor(private likeservice: LikesService) {
  
    }
     transform(post: MainPost, ...args: any[]): any {
      const UserId = localStorage.getItem('UserId');
      this.getlikes(post);
      if (this.postlikes === 0) {
        return '0 Likes';
        } else {
        return this.postlikes + ' Likes';
        }
    }
     getlikes(post: any) {
      this.likeservice.getalllikes(post).subscribe(data =&gt; {
        console.log();
        // likes = data;
        this.postlikes = data;
      }, (err: any) =&gt; console.error(err));
  
    }
  
  }
  </code></pre>