Trying to use forkJoin with subscription-CodePudding

I am trying to use forkJoin on subscription, for some reason it won't work at all, I can't console log my code, most likely .subscribe is not even reached, what am I missing here?

public SUB_getActSearch: Subscription;

this.SUB_getActSearch = this.searchService.getActSearch({ ...searchOBJ2, PageSize: this.pageSize, PageNumber: this.currentPage }).subscribe((res) => {
        this.Act_Data = [];
        let headerPagin = JSON.parse(res.headers.get('X-Pagination'));
        this.elementsLength = headerPagin.totalCount;
        this.currentPage = headerPagin.currentPage;
        this.pageSize = headerPagin.pageSize;
        res.body.map((param) => {
          this.Act_Data.push(param);
        });
        this.ActDataSource = new MatTableDataSource<Element>(this.Act_Data);
        // console.log('Your form data : ', this.ActDataSource);
      });

  public testingforkJoin(): void {
    forkJoin(
      this.SUB_getActSearch
    ).subscribe(val => console.log("xxxxx", val));
  }

I want to use forkJoin on this.SUB_getActSearch and console log something as soon as this.SUB_getActSearch is completed, just to test forkJoin operator

CodePudding user response：

Check your console where you run angular, you should get some errors there. forkJoin doesn't take subscriptions as input.

Since you only have one observable (this.searchService.getActSearch(...)), there is no need for forkJoin. Your understanding of observables and subscriptions seem to be a bit off, but I'll make some assumptions about what you want to accomplish and put some comments on the way.

public getActSearch$: Observable<any>; // specify correct type instead of any if possible

ngOnInit() {
    // I'm not sure if this code is inside an ngOnInit since you didn't 
    // specify where the code is in your example, but I'll assume it is. 
    this.getActSearch$ = this.searchService
        .getActSearch({ 
            ...searchOBJ2, 
            PageSize: this.pageSize, 
            PageNumber: this.currentPage 
        }) 
        // You will need to use shareReplay if the observable only emits one value 
        // and you want to be able to subscribe to it multiple times
        .pipe(shareReplay()); 

        // This will fire off the getActSearch request (which I assume is a http call)
        // And the initialize the values with the result
        this.getActSearch$.subscribe(res => this.initValues(res));
}

// I separated the observer code from your example into its own method
// so that you can choose when to initialize your values
private initValues(res) {
    this.Act_Data = [];
    let headerPagin = JSON.parse(res.headers.get('X-Pagination'));
    this.elementsLength = headerPagin.totalCount;
    this.currentPage = headerPagin.currentPage;
    this.pageSize = headerPagin.pageSize;
    res.body.map((param) => {
        this.Act_Data.push(param);
    });
    this.ActDataSource = new MatTableDataSource<Element>(this.Act_Data);
    // console.log('Your form data : ', this.ActDataSource);
});

public testingSubscribingAgain(): void {
  // Because the observable is replayed through `shareReplay`, when you come here you will fire a new http request. 
  // It's unclear if that's your intention.
  this.getActSearch$
      .subscribe(val => {
          // Do you want to reinitialize the values here?
          this.initValues(val); 
          console.log("xxxxx", val));
  })
}