Observable subscribe empty result on Api call

Issue

Im creating an Observable to handle my data that require a parameter. And for new values that are added have used BehaviourSubject.

heroes$: Observable<any> = this.heroService.heroes$

constructor(private heroService: HeroService){
   this.heroes$.subscribe(x=> console.log('fffffffffff',x)
        )
        }
//result up is empty

  <li *ngFor="let hero of heroes$ | async">
    <a routerLink="/detail/{{hero.id}}">
      <span class="badge">{{hero.id}}</span> {{hero.contentmsg}}
    </a>
    <button class="delete" title="delete hero"
      (click)="delete(hero)">x</button>
  </li>

Than in service have implemented a simple logic to list data and add a new data.

  heroes$ = merge(
    this.allHeroes$,
    this.heroCUDAction$
  .pipe(
    tap(data => console.log('333333333', data)), //data here displayed corectly
    scan((heroes, heroAction) => this.modifyHeroArray(heroes, heroAction), [] as any[]),  
  );


  private modifyHeroArray(heroes: any[], value: Action<any> | any[]): any[] {
    if (!(value instanceof Array)) {
      if (value.action === `add`) {
        // Add the hero to the array of heroes
        return [...heroes, value.hero];
      } 
    } else {
      return [...value];
    }
    return heroes;
  }

The service called is a Post request

  allHeroes$ = this.getSpecificMessage(
    {
      "id_conv":1,
      "skipData": 0
      }
        )


 getSpecificMessage(req:any): Observable<any> {
    return this.http.post<any>(
      `http://localhost:3000/conversation/getSpecificMessage`,  {
        "from_user":1,
        "to_user":2
        }, httpOptions
    )
      .pipe(
        tap(data => console.log('data', data)),
        catchError(this.handleError<any[]>('getHeroes', []))
      )
  }

Solution

Be carefull on how are you converting your data.

Adding the pipe and other functions its okay. If tap is working also subscribe should work. So the error eventually will be at scan.

.pipe( tap(data => console.log('333333333', data)), //data here displayed corectly scan((heroes, heroAction) => this.modifyHeroArray(heroes, heroAction), [] as any[]),
);

Answered By - Stefani Totokotsopoulou