Porównaj ceny domen i usług IT, sprzedawców z całego świata

Subskrypcja nie jest błędem funkcji


Próbuję zasubskrybować obserwowalny z usługi, kompiluje się bez błędów, ale pojawia się błąd „this.service.getBanners (...). Subskrypcja nie jest funkcją” podczas przeglądania w przeglądarce.
Usługa:
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';@Injectable()export class BannerService { banners: any = ['1','2','3']; constructor( ) {} getBanners(): Observable<any[]> {
return this.banners;
} setBanners(banners: any[]): void {
this.banners = banners;
}}

Składnik:
import { Component, ViewEncapsulation, OnInit } from '@angular/core';
import { Observable } from 'rxjs';
import { BannerService } from './../banner/banner.service';@Component({
selector: '.banner',
templateUrl: './banner.component.html',
styleUrls: ['./banner.component.sass'],
encapsulation: ViewEncapsulation.None
})export class BannerComponent implements OnInit { banners: any[]; constructor(private bannerService: BannerService){ } ngOnInit() {
this.bannerService.getBanners().subscribe(banners => this.banners = banners);
}
}

Jakieś pomysły, co robię źle?
Zaproszony:
Anonimowy użytkownik

Anonimowy użytkownik

Potwierdzenie od:

Musisz zwrócić obserwowalne, zamiast tego zwracasz tablicę:

Dla Angular & < = 5.x.x

getBanners(): Observable<any[]> {
return Observable.of(this.banners);
}


Dla Angular & > = 6.x.x

getBanners(): Observable<any[]> {
return of(this.banners);
}

Połączyć
https://stackoverflow.com/a/38067643/7123439
Anonimowy użytkownik

Anonimowy użytkownik

Potwierdzenie od:

Coś trzeba naprawić.
  • Deklarujesz, że twoja funkcja getBanners () zwraca obserwowalną, ale zwracasz tablicę. Dlatego zmień swoje oświadczenie o zwrocie na
    return Observable.from(this.banners);

Musisz również dodać to:
import 'rxjs/add/observable/from';

<ol start="2">
[*]
To jest zła praktyka i będzie zawierać całą bibliotekę rxjs w twoim kodzie:
import { Observable } from 'rxjs';
[/*]
[/list]
Importuj tylko to, czego potrzebujesz. Wymień powyżej
import { Observable } from 'rxjs/Observable';

Aby odpowiedzieć na pytania, Zaloguj się lub Zarejestruj się