23 lines
793 B
TypeScript
23 lines
793 B
TypeScript
import { Component, inject, Input } from '@angular/core';
|
|
import { Recipe } from '../../model/Recipe.model';
|
|
import { injectQuery } from '@tanstack/angular-query-experimental';
|
|
import { ImageService } from '../../service/image.service';
|
|
|
|
@Component({
|
|
selector: 'app-recipe-page-content',
|
|
imports: [],
|
|
templateUrl: './recipe-page-content.html',
|
|
styleUrl: './recipe-page-content.css',
|
|
})
|
|
export class RecipePageContent {
|
|
@Input({ required: true })
|
|
public recipe!: Recipe;
|
|
|
|
private readonly imageService = inject(ImageService);
|
|
|
|
protected mainImageUrl = injectQuery(() => ({
|
|
queryKey: ['images', this.recipe.mainImage.owner.username, this.recipe.mainImage.filename],
|
|
queryFn: () => this.imageService.getImage(this.recipe.mainImage.url),
|
|
}));
|
|
}
|