eckig 2 rc4 Erstellen von Variablen nach dem Erhalten von Daten aus Http Observable

Question

Ich bin irgendwie neu in angular2, ich hoffe, Sie könnten mir helfen, ich bin ziemlich sicher, es muss etwas einfaches sein, aber das ist der Deal im machen einen Dienst, der http Anrufe verarbeiten könnte aber seine benötigen einige Filter anwenden, nachdem die Daten, ohne zu fragen noch einmal auf den api-Server mit neuen Parametern geladen werden im Grunde ich will lassen angular2 dass

Teil zu behandeln

-Update **

Dienst

httpHandler(type,model){var token = this.LoginService.JwtDecoded(); var authHeader = new Headers(); authHeader.append('Authorization', 'Bearer ' + token);

return this.http.get('http://127.0.0.1/api/service/'+model, { 
     headers: authHeader 
     }) 
    .map((res: Response) => res.json()); } 

Komponente

this.Request.httpHandler('get','receiver/') 
.subscribe(
    data => this.data = data, <-- from here 
    err => this.error = 'there is a mistake!', 
    () => console.log(this.data) <-- this one is outputing just what i want 
); 
console.log(data); <-- i wanna output the same result in here 

Also, wie kann ich die api in eine Variable führen erfassen?

update ** Ich möchte 'this.data' außerhalb subscribe ausgeben, seltsame Sache ist, dass ich innerhalb subscribe ausgeben kann und in der HTML als auch, aber ich muss ein paar Sachen mit diesem Json vor der Ausgabe in der HTML tun. Irgendwelche Ideen Jungs? Vielen Dank!

Danke für Ihre Zeit Jungs, sehr geschätzt.

Answer 1

einen Dienst erstellen, die Daten

// xyz.service.ts 

import {Injectable} from '@angular/core'; 

import {Http, Response} from '@angular/http'; 
import {Observable} from 'rxjs/Observable'; 
import 'rxjs/add/operator/map'; 

@Injectable() 
export class DataService { 
    private url = `receiver/`; 

    constructor(private http: Http) { 
    } 

    getData(): Observable<any> { 
    return this.http.get(this.url) 
     .map((res: Response) => res.json()); 
    } 
} 

nun diesen Dienst nutzen in der Komponente zu holen.

//xyz.component.ts 

import {Component, OnInit} from '@angular/core'; 

import {DataService} from './xyz.service'; 

import {HTTP_PROVIDERS} from '@angular/http'; 

@Component({ 
    selector: 'app-home-content', 
    templateUrl: 'xyz.component.html', 
    styleUrls: ['xyz.component.scss'], 
    providers: [DataService, HTTP_PROVIDERS] 
}) 
export class HomeContentComponent implements OnInit { 
    private data: Object; 

    constructor(private _dataService: DataService) { 
    } 

    ngOnInit() { 
    this._dataService.getData().subscribe(data => { 
     this.data = data; 
    }); 
    } 
} 

Jetzt werden die Daten in this.data