Как загрузить данные по параметру роутинга?

Question

[Artem0071]

Добрый день!

Как создать компонент, который будет принимать параметр из роутинга и относительно него отправлять get запрос?

На данный момент вот что есть:

import { Component, OnInit} from '@angular/core';
import { ActivatedRoute} from '@angular/router';
import { Response} from '@angular/http';
import { HttpService} from '../../services/http.service';

@Component({
    moduleId: module.id,
    selector: 'item-info',
    templateUrl: 'post.component.html',
    providers: [HttpService]
})
export class PostComponent implements OnInit {

    id;
    Post;
    constructor(private activateRoute: ActivatedRoute,private httpService: HttpService){}

    ngOnInit(){
        this.id = this.activateRoute.snapshot.params['id']; // получаем id из параметра в роутинге
        this.httpService.getOnePost(this.id).subscribe((data: Response) => this.Post=data.json()); // запарашиваем get запрос из сервиса
    }
}

HttpService

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

@Injectable()
export class HttpService{
    constructor(private http: Http){ }
    getBlog(){
        return this.http.get('blog.json');
    }
    getOnePost(id){
        return this.http.get('blogOne.json');
    }
}

Но это не работает.
Как вообще сделать такой компонент, только рабочий?)
Есть какой то пример, где одновременно получение id и отправка запроса?
Пояснение что не работает

Answer 1

[Александр]

Покажи реализацию HttpService
Что пишет в стектрейс?

Comments

[Artem0071]

добавил в вопрос

[Artem0071]

Я так понял, что у меня не получается перебрать массив верно

[Александр]

Добавь в методы как написано ниже и посмотри в лог консоли браузера

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

@Injectable()
export class HttpService{
constructor(private http: Http){ }
getBlog(){
return this.http.get('blog.json').map(this.extractData).catch(this.handleError);
}
getOnePost(id){
return this.http.get('blogOne.json')..map(this.extractData).catch(this.handleError);
}
}

private extractData(res: Response) {
let body = res.json();
return body.data || { };
}

private handleError(error: any) {
// In a real world app, we might use a remote logging infrastructure
// We'd also dig deeper into the error to get a better message
let errMsg = (error.message) ? error.message :
error.status ? `${error.status} - ${error.statusText}` : 'Server error';
console.error(errMsg); // log to console instead
return Observable.throw(errMsg);
}

[Artem0071]

Спасибо большое) Я с этим уже разобрался, в компонент приходят нужные данные, но я не могу их разобрать правильно. Как перебрать массив объекта? Буду рад, если и тут поможете)