Observables with Angular 2 isn't working (Http method)

Issue

I'm having trouble with my service. I have a service which gets a JSON from the HTTP module and fill a class 'olders' with it. But when I call my service, it doesn't do anything and my class olders is still undefined...

And if I make a *ngFor directive in the yearbook.component.html, I just get nothing... I think my problem came from my service, but I don't know where is the error...

Even if I put the console.log inside of the subscribe

my yearbook.component :

import {Component} from '@angular/core'
import {Olders} from './olders'
import {OldersService} from './olders.service'

@Component({
  moduleId: module.id,
  selector: 'yearbook',
  templateUrl: 'yearbook.component.html',

})

export class YearbookComponent {

  olders : Olders[];

  constructor(
    private _oldersService : OldersService
  ){}


  ngOnInit() {

    this._oldersService.getOldersfromAPI()
                       .subscribe( res => {this.olders = res,
                                           console.log(this.olders)},
                                   err => console.error(err.status)
                                 );
        
   
  }
 }

and the olders.service :

import {Injectable} from '@angular/core'
import {Http} from '@angular/http'
import {Olders} from './olders'
import 'rxjs/add/operator/map'
import 'rxjs/add/operator/do'

@Injectable ()

export class OldersService {

  constructor(private _http:Http) {

  }

  getOldersfromAPI(){

    return this._http.get('../CDN/olders.json')
                     .do(x => console.log(x))
                     .map(olders => {olders = olders.json()});
  }
}

Thanks in advance for all your answers

Solution

You are missing a return statement in your mapping:

.map(olders => {olders = olders.json()});

should be:

.map(olders => { return olders = olders.json()});

Answered By - AT82