Попробуйте определить класс или интерфейс с полями, необходимыми для продукта (imageurl, et c), затем импортируйте его в свой компонент и создайте переменную продукта в качестве нового типа, например product: Product; вместо product: {};
Например, новый файл product.ts
export class Product
{
imageUrl: string;
title: string;
//etc
}
существующий component.ts:
import { Router, ActivatedRoute } from '@angular/router';
import { Component, OnInit } from '@angular/core';
import { CategoriesService } from 'src/app/categories.service';
import { ProductService } from 'src/app/product.service';
import { Product } from 'src/app/product';
import 'rxjs/add/operator/take';
@Component({
selector: 'app-product-forms',
templateUrl: './product-forms.component.html',
styleUrls: ['./product-forms.component.css']
})
export class ProductFormsComponent implements OnInit {
categories$;
product: Product;
constructor(categoryservice: CategoriesService , private productservice: ProductService , private router: Router,
private route: ActivatedRoute) {
this.categories$ = categoryservice.getcategories();
let id = this.route.snapshot.paramMap.get('id');
if (id) { this.productservice.get(id).take(1).subscribe(p => this.product = p); }
}
save(product) {
this.productservice.create(product);
this.router.navigate(['/admin/products']);
}
ngOnInit() {
}
}
Где вы делаете http-вызов для получения данных о продукте, также импортируете и укажите тип продукта, например:
get(): Observable<Product> {
return this.http.get<Product>(exampleUrl);
}