Use union type variable in an async pipe with Angular

Question

My template contains an async pipe for input binding with a union type variable :

<app-mycomponent *ngSwitchCase="'myType'" [target]="myVar| async"></app-mycomponent>

myVar is either Observable or string as a type.

@Input() myVar!: Observable<blabla>[]> | string;

But I get this error :

Argument of type 'string | Observable<blabla[]>' is not assignable to parameter of type 'Observable<blabla[]> | Subscribable<blabla[]> | Promise<blabla[]>'.

How can I cast my variable to pass the async pipe ?

Answer 1

Basically you can't. But in such case we can create inner Observable.

@Input() set myVar(value: Observable<blabla[]> | string) {
  this.innerVar = typeof value === 'string' ? of(string) : value;
}

<app-mycomponent [target]="innerVar| async"></app-mycomponent>