async subscription in ng-template that is being renedered in [ngTemplateOutlet] of ng-container

Question

I got following ng-templates in my html

<ng-template #jokesApi>
  <div class="joke-table" *ngIf="apiJokes$ | async as response">
    <table style="width: 50%">
      <tr>
        <th>joke</th>
        <th>date</th>
        <th>id</th>
      </tr>
      <tr *ngFor="let result of response?.result; let i = index">
        <td>{{ result.value }}</td>
        <td>{{ result.created_at }}</td>
        <td>{{ result.id }}</td>

        <td style="width: 100px; text-align: center">
          <button (click)="onAddJokeToStore(result)" class="add">
            <fa-icon [icon]="faPlus"></fa-icon>
          </button>
        </td>
      </tr>
    </table>
  </div>
</ng-template>

<ng-template #jokesStore>
  <div class="joke-table" *ngIf="storeJokes$ | async as response">
    <table style="width: 50%">
      <tr>
        <th>joke</th>
        <th>date</th>
        <th>id</th>
      </tr>
      <tr *ngFor="let result of response?.result; let i = index">
        <td>{{ result.value }}</td>
        <td>{{ result.created_at }}</td>
        <td>{{ result.id }}</td>

        <td style="width: 100px; text-align: center">
          <button (click)="onSendToBackend(result)" class="add">
            <fa-icon [icon]="faPlus"></fa-icon>
          </button>
        </td>
      </tr>
    </table>
  </div>
</ng-template>


<ng-container [ngTemplateOutlet]="tableTemplate"></ng-container>

And here is my TS

@Component({
  selector: 'app-table',
  templateUrl: './table.component.html',
  styleUrls: ['./table.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class TableComponent implements OnInit {
  constructor(
    private store$: Store,
    private factService: FactService,
    private activatedRoute: ActivatedRoute,
    private cdr: ChangeDetectorRef
  ) {}

  public faPlus: IconDefinition = faPlus;

  @ViewChild('jokesApi', { static: true })
  jokesApiTemplate!: TemplateRef<HTMLElement>;

  @ViewChild('jokesStore', { static: true })
  jokesStoreTemplate!: TemplateRef<HTMLElement>;
  // @ViewChild('jokesBackend') jokesBackendTemplate?: TemplateRef<HTMLElement>;

  apiJokes$: Observable<httpSearchJokeResponse> =
    this.factService.searchedJokeObservable$;

  storeJokes$: Observable<any> = this.store$.select(jokeSelectors.jokeList);


  public tableType: SelectionEnum | null = null;

  public tableTemplate: any;

  ngOnInit(): void {}

  ngAfterViewInit() {
    this.activatedRoute.queryParams.subscribe((params: Params) => {
      console.log(params);
      if (params['service']) {
        if (params['type']) {
          this.tableType = params['type'];
        }
      }

      if (params['searchPhrase']) {
        this.tableType = SelectionEnum.Api;

        this.factService.getJokeBySearchPhrase(params['searchPhrase']);
      }

      this.tableTemplate = this.setTable();
    });
  }

  onAddJokeToStore(jokeData: httpJokeResponse) {
    this.store$.dispatch(actions.addSingleJoke({ joke: jokeData }));
  }

  onDeleteFromServer() {}

  onSendToBackend(joke: Joke) {}

  setTable() {
    if (this.tableType === SelectionEnum.Api) {
      console.log(this.jokesApiTemplate);
      console.log(this.jokesStoreTemplate);
      return this.jokesApiTemplate;
    }

    if (this.tableType === SelectionEnum.Store) {
      return this.jokesStoreTemplate;
    }

    return;
  }

  public ngDoCheck() {}
}

The problem is that in first template when I got *ngIf="apiJokes$ | async as response" statement there is no request being sent. I can assure you 100% that when this table is used without ng-template everything works. So I won't paste code regarding api$jokes | async. But as you can see I want two versions of this table which Im passing to ng-container and in setTable() Im just returning templates from @ViewChild.

I think it should work, but Im missing something. async sub to apiJokes$ should trigger http request but it's not a case, and as I said before. The code for request is OK, but it stopped working when I've decided to have two tables that are being passed to ngTempalteOutlet...