Angular 角度4-获取产品和类别

Angular 角度4-获取产品和类别,angular,Angular,我在一个angular网站上工作,其中有一个产品页面,在这个页面上有一些类别,在每个类别中都有产品,我能够获取类别和产品,但我不知道如何组合它们 比如,我请求分类,然后对于每个分类,我再次请求该分类中产品的API 我可能听起来是个新手(实际上我是),但任何帮助都是非常感谢的 import { Component, OnInit } from '@angular/core'; import { HttpClient } from '@angular/common/http'; import

我在一个angular网站上工作,其中有一个产品页面,在这个页面上有一些类别,在每个类别中都有产品,我能够获取类别和产品,但我不知道如何组合它们

比如,我请求分类,然后对于每个分类,我再次请求该分类中产品的API

我可能听起来是个新手(实际上我是),但任何帮助都是非常感谢的

    import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { ProductsService } from '../services/products.service';

import { Products } from '../models/Products';

@Component({
  selector: 'app-products',
  templateUrl: './products.component.html',
  styleUrls: ['./products.component.css']
})
export class ProductsComponent implements OnInit {
  productList: Products[];
  productArray:any;

  constructor(private http:HttpClient, private products:ProductsService) {

   }

  ngOnInit():void {
    this.products.getProducts().subscribe(products=>{
      this.productList = products;
      this.productArray = this.productList['results'];
      console.log(this.productList['results']);
    });

   }

}

My product service 

    import { Injectable } from '@angular/core';
    import { HttpClient, HttpHeaders } from '@angular/common/http';
    import { Observable } from 'rxjs/Observable';
    import { Products } from '../models/Products';


@Injectable()
export class ProductsService {
  productURL: string = 'http://itgenesys.com/mdevices/webservices/api.php?rquest=getproducts&catid=8';

  constructor(private http:HttpClient) { }

  getProducts(): Observable<Products[]>{
   return this.http.get<Products[]>(this.productURL)
  }

}

}

但我不知道如何将它们结合起来
你到底想实现什么?期望的结果是什么?在产品页面上有类别列表,在这些类别中产品将出现,因此我希望为类别运行一个循环,为每个类别的产品运行另一个循环。Categoies是由用户选择的,但它们是固定的,因此我想在页面加载时使用ngOnInit获取类别和产品。在您从服务接收数据后,
this.productList
的值是什么?我已经添加了JSON,请检查。它的类别是ID,有人能帮我吗?
{
"status": "1",
"msg": "product list",
"results": [
    {
        "id": "1",
        "title": "MAXLITE  MACINTOSH FIBER OPTIC BLADES",
        "description": "With over 25 Years of experience and a specialized manufacturing setup, Medical Devices laryngoscopes are proven to be exceptionally reliable and durable. These are made from Superior quality materials and are subjected to strict quality control measures. Our Laryngoscope systems are not only designed to be more efficient, but also to be the most economical.\r\n\r\nMaxlite Laryngoscopes are built with an integrated Fiber Optic bundle with no cavities to trap dirt or body fluids, thus allowing the blade to be easily cleaned and decontaminated. This contributes largely to the elimination of cross infection.",
        "parentcatname": null,
        "parentcatid": "8",
        "subcatname": null,
        "subcatid": "1",
        "date": "2018-03-29 05:36:55",
        "mainphoto": "Tulips.jpg"
    },
    {
        "id": "2",
        "title": "Iphone 6",
        "description": "With over 25 Years of experience and a specialized manufacturing setup, Medical Devices laryngoscopes are proven to be exceptionally reliable and durable. These are made from Superior quality materials and are subjected to strict quality control measures. Our Laryngoscope systems are not only designed to be more efficient, but also to be the most economical",
        "parentcatname": null,
        "parentcatid": "4",
        "subcatname": null,
        "subcatid": "8",
        "date": "2018-03-29 06:50:19",
        "mainphoto": "Hydrangeas.jpg"
    }
]