为什么 forkJoin 对一系列新的 Observable 没有完成？

Question

I'm trying to use forkjoin on some asynchronous tasks but for some reason I don't get the emission on forkjoin.

See stackblitz https://stackblitz.com/edit/angular-12-form-validation-yrstmk?devtoolsheight=33&file=src/app/app.component.ts

import { forkJoin, Observable, ReplaySubject } from 'rxjs';
import { switchMap } from 'rxjs/operators';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  db: ReplaySubject<IDBDatabase> = new ReplaySubject(1);

  constructor() {}

  ngOnInit(): void {
    console.log('init!');

    setTimeout(() => {
      console.log('db init!');
      this.db.next(null);
    }, 2000);

    const test = [this.create(null), this.create(null), this.create(null)];
    forkJoin(test).subscribe(() => {
      console.log('forkjoined!');
    });
  }

  create(variable: any): Observable<any> {
    return this.db.pipe(
      switchMap(
        () =>
          new Observable<any>(observer => {
            setTimeout(() => {
              console.log('next!');
              observer.next(variable);
              observer.complete();
            }, 1000);
          })
      )
    );
  }
}

Answer 1

The answer is the outer observable is a ReplaySubject which will not complete.

I simply added take(1) to my pipe.

  create(variable: any): Observable<any> {
    return this.db.pipe(
      take(1),
      switchMap(
        () =>
          new Observable<any>(observer => {
            console.log('next!');
            observer.next(variable);
            observer.complete();
          })
      )
    );
  }

Answer 2

I've just updated your stackblitz.: https://stackblitz.com/edit/angular-12-form-validation-adupub?file=src/app/app.component.ts

You have to:

• Add a variable to access it on subscribe(HERE).
• Return a value in the next.

Check de diffs:
Your code:

// line 30
forkJoin(test).subscribe(() => {
   console.log('forkjoined!');
});
//line 42
switchMap(
        () =>
          new Observable<any>(observer => {
            console.log('next!');
            observer.next(variable);
            observer.complete();
          })
      )

My code:

//line 30
forkJoin(test).subscribe((data) => {
   console.log('forkjoined!',data);
});
//Line 42
switchMap(
        () =>
          new Observable<any>(observer => {
            console.log('next!');
            observer.next("variable");
            observer.complete();
          })
      )