[Angular 2] Démontrer la fonction map()

Bonsoir,

je but toujours sur cette fonction map(), j'essayer de faire sa démonstration pour la comprendre et bien l'utiliser,
que pensez vous de ce bout de script:?:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
 
import { Component } from '@angular/core';
import { Http, Response,Headers,RequestOptions } from '@angular/http';
import { Observable } from 'rxjs/Rx';
import 'rxjs/add/operator/map';
 
@Component({
  selector: 'my-app',
  template: `<h1>Hello {{name}}</h1>`,
})
export class AppComponent{
  name = 'Angular';
 
  constructor(private _http:Http){
      this.getWbs();
  }
 
  getWbs():Observable<Matiere>{
    let wbs = this._http.get('http://192.168.0.11:8000/api').map(
      reponse => reponse.json()
    );
    console.log(wbs);
 
    let M:Matiere = new Matiere();
    return wbs;
  }
}
 
class Matiere{
  id:number;
  name:string;
  _id:string;
 
  constructor(){
    console.log("je suis la classe matiere");
    console.log("mon id est:",this.id);
    console.log("mon id est:",this.name);
    console.log("mon id est:",this._id);
  }
}

avec postman voici la réponse de la requête get:

Code:

1
2
 
[{"id":0,"name":"unseul","_id":"587d04affd91045ab7a73ac3"}]

Pièce jointe 235494
voici ce que j'ai en console:

Code:

1
2
3
4
5
6
7
 
Object { _isScalar: false, source: Object, operator: Object } app.component.js:22:9
je suis la classe matiere app.component.js:38:9
mon id est: undefined app.component.js:39:9
mon id est: undefined app.component.js:40:9
mon id est: undefined app.component.js:41:9
Angular is running in the development mode. Call enableProdMode() to enable the production mode.

mes attributs ne sont pas chargé ? (undefined)
comment je dois m'y prendre à moin que je n'ai toujours pas compris la fonction map() ?

merci de vos réponses :)