2016-04-23 8 views
4

Ich versuche, einen REST-API-Aufruf zu meinem anderen lokalen Host-Server zu machen, ich habe diesen Dienst gemacht:http definiert mich nicht in angular2

import {Injectable} from 'angular2/core'; 
import {Http} from 'angular2/http'; 
import {GlobalService} from '../app.service'; 

@Injectable() 
export class AuthenticationService { 
    constructor(private _globals: GlobalService) {} 
    constructor(private _http: Http) {} 
    globals = this._globals.getGlobals() 

    getAuthenticationData() { 
     this._http.get(globals.apiURL) 
    } 
} 

Und es in meiner Komponente Aufruf:

import { Component } from 'angular2/core'; 
import {AuthenticationService} from '../services/authentication.service'; 

@Component({ 
    selector: 'wd-header'; 
    templateUrl: 'app/templates/header.html' 
    providers: [AuthenticationService] 
}) 

export class HeaderComponent { 
    constructor(private _authenticationService: AuthenticationService) {} 
    authentication = this._authenticationService.getAuthenticationData() 
} 

Aus irgendeinem Grund aber, Angular Ansprüche, die Http nicht definiert ist:

EXCEPTION: Error during instantiation of HeaderComponent!. angular2.dev.js:22911:9

ORIGINAL EXCEPTION: TypeError: this._http is undefined

Was mache ich falsch?

bearbeiten schließen main.ts:

import {bootstrap} from 'angular2/platform/browser'; 

import {ROUTER_PROVIDERS} from 'angular2/router'; 
import {HTTP_PROVIDERS} from 'angular2/http'; 
import {App} from './app.component'; 
import {GlobalService} from './app.service'; 

bootstrap(App, [ 
    ROUTER_PROVIDERS, 
    HTTP_PROVIDERS, 
    GlobalService 
]); 
+0

@pixelbits Ja. –

+0

Wird die Datei 'http.dev.js' in Ihrer' index.html' referenziert? – Brad

Antwort

2

würde ich den Code Ihrer Dienstleistung auf diese Weise Refactoring:

@Injectable() 
export class AuthenticationService { 
    constructor(private _globals: GlobalService, private _http: Http) { 
    this.globals = this._globals.getGlobals(); 
    } 

    getAuthenticationData() { 
    return this._http.get(this.globals.apiURL); 
    } 
} 

Sie benötigen nur einen Konstruktor für Ihren Dienst haben und die Globals-Eigenschaft in diesem Konstruktor zu initialisieren.

Achten Sie auch darauf, das Schlüsselwort "this" zu verwenden, um Klasseneigenschaften aus der Klasse selbst zu referenzieren.

+0

Dies behebt die Fehler, aber wenn man sich die Netzwerkkonsole in Firefox anschaut, wird die http-Anfrage tatsächlich nie gemacht. –

+0

Sie müssen das Objekt abonnieren, das von der getAuthenticationData-Methode zurückgegeben wird. Observable sind faul. Sie werden nur ausgeführt, wenn sie abonniert sind ;-) –

+0

Können Sie mir ein Beispiel geben? –

2

denke ich, dass das Problem in Ihrem Code ist, dass Sie zwei Konstruktoren in Ihrem AuthenticationService verwenden.

Versuchen Sie es wie folgt zu bearbeiten:

constructor(private _globals: GlobalService, private _http: Http) {} 

Und eine return-Anweisung in getAuthenticationData() hinzuzufügen.

Lassen Sie mich wissen, wenn es es behebt.

+0

Jetzt ist '_globals' undefined. –

+0

Also die Dienste sind nicht bereit für die Verwendung. Versuchen Sie, Globals in der onOnit-Methode in AuthenticationService zu initialisieren. Das Gleiche gilt für die Authentifizierung in HeaderComponent. –