Angular 如何在详细信息页面中从单个对象（本地JSON）获取详细信息

我有一个JSON对象：

[
    {
    "products": [
        {
            "id": "1",
            "name": "Apple",
            "price": "free",
            "imageURL": "assets/apples.jpg",
            "category": "Fruits"
        },
      and so on...

我正在尝试获得如下详细信息页面：

霍姆斯

categories: any;
  products: Product[]=[];
  filteredProducts: Product[]=[];
  category: string;
  constructor(private dataService: DataService, private route: ActivatedRoute) { }
  ngOnInit() {
          this.route.queryParams.subscribe(params=>{
            console.log(params);
          this.category = params['categories'];
          forkJoin([this.getCategories(), this.getProducts()]).subscribe(() =>  {

              this.filteredProducts=(this.categories && this.category)? 
              this.products.filter(p=> p.category.toLowerCase()===this.category.toLowerCase()) :
              this.products; 
              console.log(this.filteredProducts)
          });

         })
      }

      public getCategories(): Observable<boolean> {
        return this.dataService.getCategories().pipe(map(categories => {
          this.categories = categories[0]['categories']
          return true;
        }));
      }
      public getProducts(): Observable<boolean> {
        return this.dataService.getProducts().pipe(map(p => {
          this.products = p[0]['products']
          console.log(this.products)
          return true;
        }));
      }

以及数据服务方法：

public getProduct(id):Observable<any>{
    return this.http.get('assets/products.json', id) 
  }

public-getProduct（id）：可观察的
您正在寻找类似的东西吗

public getProduct(id):Observable<any>{
    return this.http.get('/assets/products.json/').map( (res: Response) => res[0].products.filter(x=>x.id==id));
  }

publicGetProduct（id）：可观察{
返回此.http.get（'/assets/products.json/'）.map（（res:Response）=>res[0].products.filter（x=>x.id==id））；
}
您是在尝试get还是post method？@pc\u coder这是一种get方法，您可以在上面看到它，所以这是数据服务上getProduct中的代码块？是的。您需要在json文件中将url搜索参数附加到具有正确名称的id。如果您的角度版本超过4，则此行`{search:params}`将获取redishuse params:params第一个参数（键）仍为红色。其他事情：就像我的原始代码一样，我在html上添加了一些东西，比如
{{{id}}
它给了我正确的id
public getProduct(id):Observable<any>{
    return this.http.get('assets/products.json', id) 
  }

public getProduct(id):Observable<any>{
    return this.http.get('/assets/products.json/').map( (res: Response) => res[0].products.filter(x=>x.id==id));
  }