Angular 角度6-属性'；订阅'；不存在于类型'；运算符函数<；{}，{}>；？

我用Angular 6创建了一个新项目，但当我尝试添加http请求时，我得到了一个.subscribe错误。 我只能为Angular的早期版本找到解决方案。 有人能帮忙吗

//产品服务

    import {Injectable} from "@angular/core";
    import {Http,Response} from "@angular/http";
    import {Observable} from "rxjs";
    import { map, catchError } from 'rxjs/operators';

    @Injectable()
    export class ProductService {

        constructor(public http: Http) { }

        public getProducts(dataURL:string){
            return this.http.get(dataURL)
                .pipe(map((res:Response) => res.json())),
                catchError((error:any) => Observable.throw(error || 'Server error'));
        }
    }

//类别.component.ts

    import { Component, OnInit } from '@angular/core';
    import {ProductService} from "../../services/products.service";
    import {Product} from "../../model/product";
    import {CartService} from "../../services/cart.service";
    import {Router} from "@angular/router";

    @Component({
        selector: 'app-category',
        templateUrl: './category.component.html',
        styleUrls: ['./category.component.css']
    })
    export class CategoryComponent implements OnInit {
        public products:Array<Product>;
        private sub;
        constructor(
             private productService:ProductService,
             private cartService:CartService,
             private router: Router
        ) { }

        ngOnInit() {
            this.load();
        }
        load = () => {
           this.sub = this.productService.getProducts('./assets/mock-data/products.json')
                .subscribe(res => {
                    this.products = res;
                })
        };
        addToCart = (product) => {
            this.cartService.addToCart({product,quantity:1})
        };
        ngOnDestroy() {
            this.sub.unsubscribe();
        }
    }

从'@angular/core'导入{Component，OnInit}；
从“../../services/products.service”导入{ProductService}”；
从“../../model/Product”导入{Product}；
从“../../services/cart.service”导入{CartService}”；
从“@angular/Router”导入{Router}”；
@组成部分({
选择器：“应用程序类别”，
templateUrl:'./category.component.html'，
样式URL:['./category.component.css']
})
导出类CategoryComponent实现OnInit{
公共产品：阵列；
私人分公司；
建造师(
私人产品服务：产品服务，
私人cartService:cartService，
专用路由器
) { }
恩戈尼尼特（）{
这个.load（）；
}
加载=（）=>{
this.sub=this.productService.getProducts（'./assets/mock data/products.json'）
.订阅（res=>{
这个产品=res；
})
};
addToCart=（产品）=>{
this.cartService.addToCart（{product，quantity:1}）
};
恩贡德斯特罗（）{
此.sub.取消订阅（）；
}
}

在

管道

功能内移动

捕捉错误

catchError

是一个rxjs运算符。操作员需要环绕

管道

函数才能使用它

 return this.http.get(dataURL)
  .pipe(
     map((res:Response) => res.json()),
     catchError((error:any) => Observable.throw(error || 'Server error'))
  ),

---

哇，太谢谢你了！！我已经在这上面很久了哈哈