orchid lantern
Hello guys, is possible to use union type with signal in template ?
I have 2 interfaces and a type
`export interface ProductResponse<T> {
products: T;
total: number;
skip: number;
limit: number;
}
export interface UserResponse<T> {
users: T;
total: number;
skip: number;
limit: number;
}
export type ApiResponse<T> = ProductResponse<T> | UserResponse<T>;`
an a interface for my signal
export interface VmSignal<T> { data: T | null; loading: boolean; error: string | null; }
then, I use them like that
productsSignal: Signal<VmSignal<ApiResponse<Product[]>> | undefined> = toSignal( this._productService.getAll().pipe( map((result) => ({ data: result, error: null, loading: false, })), startWith({ data: null, loading: true, error: null }), catchError((error) => of({ data: null, error: 'error', loading: false }) ) ) );
But my template does not recognize the product property.
{ @for (product of productsSignal()?.data?.products; track $index) { <p-card> <h2>{{ product }}</h2> <div class="flex gap-2 flex-row align-items-start justify-content-center"> <img src="../../assets/images/img-product.png" alt="" /> <div class="info"> <p class="font-bold">{{ product.price }}</p> <p class="font-bold">{{ product.description }}</p> </div> </div> </p-card> }
data.products not exist.
Look like is not really possible
grizzled plume