Kann nicht Eigentum ‚get‘ undefinierter Winkel 2

Question

Ich ziehe meine gets auf eine andere service.ts für meine Anwendung lesen, aber ich bekomme diese error

Hier ist mein Code: AppComponent.ts

import { Component } from '@angular/core'; 
import {Http } from '@angular/http'; 
import 'rxjs/Rx'; 
import {FeatureService} from "./Feature.service"; 


@Component({ 
    selector: 'my-app', 
    providers: [FeatureService], 
    template: `<h1>Hier staat de json die we uit de test hebben gehaald</h1> 
       <p>Deze json hallen we van vert.x af en kunnen we converten naar een mooie rapport.</p> 
       <button (click)="clicked()">Haal test Json op</button> 
       <button (click)="getFeatures()">features</button> 
       <button (click)="getScenarios()">scenarios</button> 
       {{leerling}} 

       `, 
}) 
export class AppComponent { 
    titel = ""; 
    leerling: any; 
    leerlingUrl = 'http://localhost:8080/testresultaten'; 

    public clicked(){ 
     this.http.get(this.leerlingUrl).map(res => res.json()) 
     .subscribe(data => this.leerling = JSON.stringify(data) 
      ,error => this.leerling = "error",() => console.log("Json got good")); 
    } 
    public getFeatures(){ 
     this.leerling = FeatureService.getFeature(); 
    } 
    public getScenarios(){ 
    this.http.get('http://localhost:8080/features/1/scenarios').map(res => res.json()).subscribe(data => this.leerling = JSON.stringify(data),error => this.leerling = "error",() => console.log("Json got good")); 
    } 

constructor(private http : Http, private featureService : FeatureService){ 
} 

} 

und hier ist mein Feature.service.ts

import {Http} from "@angular/http"; 

export class FeatureService{ 
    private static http : Http; 


    static getFeature(){ 
    return this.http.get('http://localhost:8080/features') 
     .map(data => data.toString()); 
    } 
} 

Die Alten (geklickt() und getScenarios()) noch arbeiten, aber Feat ureService.getFeature() inclulde es nicht

entweder

Answer 1

Sie verwenden die Abhängigkeitsinjektion nicht korrekt. Im statischen Kontext gibt es keine this.

import { Injectable } from "@angular/core"; 
import { Http } from "@angular/http"; 

@Injectable() // note this 
export class FeatureService { 
    constructor(protected http: Http) {} 


    getFeature(){ // note: no "static" here. This is instance method. Service will be singleton anyway. 
    return this.http.get('http://localhost:8080/features') 
     .map(data => data.toString()); 
    } 
} 

Sie sollten Provider Deklaration umschreiben wie @NgModule wie andere sagten. Ihre Lösung war für Beta-Versionen korrekt und wird in aktuellen Versionen nicht funktionieren.

BTW, ich hoffe, dies ist nur ein Beweis der Konzept-Implementierung, wie Code-Qualität wirklich niedrig ist (keine konfigurierbaren Endpunkte, HTTP ohne Service in Komponente, keine @NgModule, schlechte Code-Formatierung, veraltete/entfernte APIs, Tippfehler).

Answer 2

enthalten keine providers: [FeatureService], in der Komponente funktioniert in @NgModule

im Grunde wird es Kiste neue Instanz des Dienstes und Ruine Singletonmuster

Answer 3

export class AppComponent { 
    titel = ""; 
    leerling: any; 
    leerlingUrl = 'http://localhost:8080/testresultaten'; 

    public clicked(){ 
     this.http.get(this.leerlingUrl).map(res => res.json()) 
     .subscribe(data => this.leerling = JSON.stringify(data) 
      ,error => this.leerling = "error",() => console.log("Json got good")); 
    } 
    public getFeatures(){ 
     this.leerling = this.featureService.getFeature(); 
    } 
    public getScenarios(){ 
    this.http.get('http://localhost:8080/features/1/scenarios').map(res => res.json()).subscribe(data => this.leerling = JSON.stringify(data),error => this.leerling = "error",() => console.log("Json got good")); 
    } 

    constructor(private http : Http, private featureService : FeatureService){ 
    } 

} 

und Service

import {Http} from "@angular/http"; 
@Injectable() 
export class FeatureService{ 
    private static http : Http; 


    getFeature(){ 
    return this.http.get('http://localhost:8080/features') 
     .map(data => data.toString()); 
    } 
}