Angular 通过网络服务订阅

我正在尝试订阅服务中的函数，但收到错误消息 类型“void”上不存在属性“subscribe” 我使用普通主题来订阅这里的值 虽然我正在发送服务文件中的值 下面是我订阅服务文件中函数的代码

 import { Injectable } from '@angular/core';
 import { BehaviorSubject, Subject } from 'rxjs';
 import { Product } from '../products.modal';
 @Injectable({
 providedIn: 'root'
 })
 export class ProductService {
 productslist=new BehaviorSubject<any>(1)
 getalllist=new Subject<any>()
 cards:any[]=[
 {
  id: 0,
  imageurl: "https://butterwithasideofbread.com/wp- 
 content/uploads/2012/07/Easiest-Best-Homemade- 
 Bread.BSB_.IMG_6014.jpg"
  ,price: "4"
  ,select: "Dairy"
  ,title: "Bread"
 },
 {
  id: 1
  ,imageurl: "https://butterwithasideofbread.com/wp- 
  content/uploads/2012/07/Easiest-Best-Homemade- 
  Bread.BSB_.IMG_6014.jpg"
  ,price: "23"
  , select: "Bread"
  ,title: "udemy"
  }

  ]
  constructor() {     
   }

 addtocards(values){
 values.id=this.cards.length
 this.cards.push(values)
 this.productslist.next(this.cards.slice())
// console.log(this.cards)
 }
getallproducts(){
return this.cards
 }

getproductbyid(id){
return this.cards[id]
 }

 update(valuestobeupdated,id){
 this.cards[id]=valuestobeupdated
this.cards[id].id=id


this.productslist.next(this.cards.slice())
}
getallproductsinallprodcuts(){
this.productslist.next(this.cards.slice())
}



}

component.ts文件

import { Subscription } from 'rxjs';


export class AllproductsComponent implements OnInit {



category
filter
allprodcuts

constructor(private prservice:ProductService,private 
router:Router,private route:ActivatedRoute) { }


subscription:Subscription
ngOnInit() {

this.route.queryParams.subscribe(params=>{
  console.log(params)
  this.category=params
})


this.subscription=this.prservice.getallproductsinallprodcuts()
.subscribe(       //Here i am facing the error
  (r)=>{
    this.allprodcuts=r
    console.log(r)
  }
)



}


}

服务文件

 import { Injectable } from '@angular/core';
 import { BehaviorSubject, Subject } from 'rxjs';
 import { Product } from '../products.modal';
 @Injectable({
 providedIn: 'root'
 })
 export class ProductService {
 productslist=new BehaviorSubject<any>(1)
 getalllist=new Subject<any>()
 cards:any[]=[
 {
  id: 0,
  imageurl: "https://butterwithasideofbread.com/wp- 
 content/uploads/2012/07/Easiest-Best-Homemade- 
 Bread.BSB_.IMG_6014.jpg"
  ,price: "4"
  ,select: "Dairy"
  ,title: "Bread"
 },
 {
  id: 1
  ,imageurl: "https://butterwithasideofbread.com/wp- 
  content/uploads/2012/07/Easiest-Best-Homemade- 
  Bread.BSB_.IMG_6014.jpg"
  ,price: "23"
  , select: "Bread"
  ,title: "udemy"
  }

  ]
  constructor() {     
   }

 addtocards(values){
 values.id=this.cards.length
 this.cards.push(values)
 this.productslist.next(this.cards.slice())
// console.log(this.cards)
 }
getallproducts(){
return this.cards
 }

getproductbyid(id){
return this.cards[id]
 }

 update(valuestobeupdated,id){
 this.cards[id]=valuestobeupdated
this.cards[id].id=id


this.productslist.next(this.cards.slice())
}
getallproductsinallprodcuts(){
this.productslist.next(this.cards.slice())
}



}

如果你看一看《英雄》和《英雄》的例子

这是在服务层。注意，它返回了一个可观察到的英雄列表

import { Observable, of } from 'rxjs';

getHeroes(): Observable<Hero[]> {
  return of(HEROES);
}

决定这样做

export const HEROES: Hero[] = [
  { id: 11, name: 'Mr. Nice' },
  { id: 12, name: 'Narco' },
  { id: 13, name: 'Bombasto' },
  { id: 14, name: 'Celeritas' },
  { id: 15, name: 'Magneta' },
  { id: 16, name: 'RubberMan' },
  { id: 17, name: 'Dynama' },
  { id: 18, name: 'Dr IQ' },
  { id: 19, name: 'Magma' },
  { id: 20, name: 'Tornado' }
];

稍后，您也可以通过适当的HTTP web服务调用轻松地交换这个模拟服务。 通常情况下，您会返回类似于此的内容，这些内容可以再次调出以返回可观察的模型列表，例如Heroes[]

private heroesUrl = 'api/heroes';

您也应该这样做，订阅组件而不是服务，并使用方法签名返回您选择的域模型列表的可观察值

通常，您会发现它的描述也是如此，不那么模棱两可：

getHeroes(): void {
  this.heroService.getHeroes()
      .subscribe( (heroes:Heroes[]) =>  {
         this.heroes = heroes
       });
}

这使得订阅中的英雄类型更有意义。它与从服务中获得的回报相结合

---

如果这有帮助，请务必接受答案。

这里有一个非常流行的公认答案，讨论这个话题-这有帮助吗？

getHeroes(): void {
  this.heroService.getHeroes()
      .subscribe(heroes => this.heroes = heroes);
}

getHeroes(): void {
  this.heroService.getHeroes()
      .subscribe( (heroes:Heroes[]) =>  {
         this.heroes = heroes
       });
}