'プロパティ' serviceData 'はタイプ' GeoService 'に存在しません。'型文字Angular2

Question

import { Injectable } from '@angular/core'; 
import { Http } from '@angular/http'; 
import 'rxjs/add/operator/map'; 
import 'rxjs/Rx'; 
import {Observable} from 'rxjs/Rx'; 
import 'rxjs/add/operator/toPromise'; 
@Injectable() 
export class GeoService { 
    constructor(private http: Http) { } 

    private extractData(res : any){ 
     if(res.status < 200 || res.status >=300){ 
      throw new Error('Bad response sttus:' + res.status); 
     } 
     this.serviceData = (res.json()); 
     return this.serviceData || {}; 
    } 

    loaddata(term: string): Observable<any> { 
    return this.http.get('http://maps.google.com/maps/api/geocode/json?address=' + term + 'CA&sensor=false') 
     .map(this.extractData); 
    } 
} 

なぜ 'service'が 'GeoServiceタイプ'に存在しません。

Answer 1

あなたのextractData関数でthis.serviceDataを参照しようとすると、サービスのどこにでも宣言していません。

試してみてください。

private extractData(res : any){ 
    if(res.status < 200 || res.status >=300){ 
     throw new Error('Bad response sttus:' + res.status); 
    } 
    let serviceData = res.json(); // declare here! 
    return serviceData || {}; 
} 

その他のオプションは、あなたのサービスでは、あなたが実際にあなたがあなたの関数でthisを使用することができ、のserviceDataを宣言することです。

export class GeoService { 
    private serviceData; 
    .... 

// and then use this: 
private extractData(res : any){ 
    if(res.status < 200 || res.status >=300){ 
     throw new Error('Bad response sttus:' + res.status); 
    } 
    this.serviceData = (res.json()); 
    return this.serviceData || {}; 
} 

} 

その後、コンポーネントでこれらを使用することができ、それはそう、あなたのOnInit方法やあなたのコンストラクタのように、サービス内の関数を呼び出している：

data; // declare a variable where you want to store the data 

constructor(private geoService: GeoService) { 
    this.geoService.loaddata() 
    .subscribe(data => { 
     this.data = data; 
     console.log(this.data); // your values here! 
    }); 
} 

私はあなたがこれを行うことをお勧めしかし、OnInitメソッド。

Answer 2

import { Injectable } from '@angular/core'; 
import { Http } from '@angular/http'; 
import 'rxjs/add/operator/map'; 
import 'rxjs/Rx'; 
import {Observable} from 'rxjs/Rx'; 
import 'rxjs/add/operator/toPromise'; 
@Injectable() 
export class GeoService { 
    public serviceData:any; 
    constructor(private http: Http) { } 

    private extractData(res : any){ 
     if(res.status < 200 || res.status >=300){ 
      throw new Error('Bad response sttus:' + res.status); 
     } 
     this.serviceData = (res.json()); 
     return this.serviceData || {}; 
    } 

    loaddata(term: string): Observable<any> { 
    return this.http.get('http://maps.google.com/maps/api/geocode/json?address=' + term + 'CA&sensor=false') 
     .map(this.extractData); 
    } 
}