类型“() => Observable<any>”上不存在属性“subscribe”

问题描述 投票:0回答:4

服务模块:

import { Observable } from 'rxjs/Rx';
import { Http,Response} from '@angular/http';
import { Injectable } from '@angular/core';
import 'rxjs/add/operator/Map';

@Injectable()
export class VideoService {

   private geturl = '/api/videos';
   constructor(private _http:Http) { }

   getvideos() {
       return this._http.get(this.geturl).map((response:Response) => {
          response.json()
       });
   }
}

这是订阅方法显示此错误的地方:

import { VideoService } from '../video.service';
import { Component, OnInit } from '@angular/core';
import { Video } from '../video';
import { Observable } from 'rxjs/Observable';


@Component({
    selector: 'app-videocenter',
    templateUrl: './videocenter.component.html',
    styleUrls: ['./videocenter.component.css']
})
export class VideocenterComponent implements OnInit {
    videos: any;
    onselectvideo: Video;
    switch: boolean = false

    constructor(private videoserv: VideoService) {
        //console.log(this.videos);
    }
    onselect(vid: any) {
        this.switch = true;
        this.onselectvideo = vid;
        console.log(vid);
    }
    ngOnInit() {
         this.videos = this.videoserv.getvideos .subscribe((response) => {
             this.videos = response;
         });
    }

}

我有一个服务,我必须调用我的 API 来返回其他 API。当我要订阅另一个类中调用该服务方法 getvideos() 的方法时,它会显示此错误,即类型 ()=> observable 上不存在属性“订阅”。

angular typescript rxjs observable angular2-services
4个回答
119
投票

您没有调用

getVideos
方法。您正在对
subscribe
的函数引用调用
getVideos
,而不是返回值。拨打
subscribe
后拨打
getVideos()
:

ngOnInit() {
    this.videoserv.getvideos().subscribe((response) => {
         this.videos = response
    });
}

6
投票
ngOnInit() {
    this.videoserv.getvideos().subscribe((response) => {
         this.videos = response
    });
}

您应该在

getvideos()
服务上调用
videoserv
方法。 您错过了
()
getvideos
是方法而不是属性。


3
投票
this.service.method().subscribe(response)...

每当输入

this.service
并出现自动建议时,在 suggest 中,会建议方法名称,一旦建议被接受,它只占用方法名称,不带括号()。

this.service.method.subscribe()..
=> 会报错

this.service.method().subscibe()..
=> 正确


1
投票

但是如果您还想在应用程序的其他位置(组件、管道...等)使用服务方法 getvideos()

你可以做

.pipe(map()) 而不是 .subscribe()

ngOnInit() { this.videoserv.getvideos().pipe(map(response) => { this.videos = response })); }
然后在您想要播放视频的地方使用

.subscribe

this.videoserv.getvideos().subscribe(response) => { this.videos2 = response });
    
© www.soinside.com 2019 - 2024. All rights reserved.