Angular2 i TypeScript: error TS2322: Typ "Response" nie jest przypisywany do "UserStatus"

Question

Gram z Angular2 i TypeScript i nie idzie dobrze (w AngularJS byłoby to łatwe). Piszę mały eksperyment aplikację, by uporać się z tym wszystkim i mam następujący komponent jako mój główny składnik/najwyższego poziomu ...

import {Component, OnInit} from 'angular2/core'; 
import {RouteConfig, ROUTER_DIRECTIVES} from 'angular2/router'; 
import {UserData} from './services/user-data/UserData'; 
import {Home} from './components/home/home'; 
import {UserStatus} from './types/types.ts'; 
import {Http, Headers, Response} from 'angular2/http'; 

@Component({ 
    selector: 'app', // <app></app> 
    providers: [...FORM_PROVIDERS], 
    directives: [...ROUTER_DIRECTIVES], 
    template: require('./app.html') 
}) 
@RouteConfig([ 
    {path: '/', component: Home, name: 'Home'}, 
    // more routes here.... 
]) 

export class App { 

    userStatus: UserStatus; 

    constructor(public http: Http) { 
    } 

    ngOnInit() { 

     // I want to obtain a user Profile as soon as the code is initialised 
     var headers = new Headers(); 
     headers.append('Content-Type', 'application/json'); 
     this.http.get('/restservice/userstatus', {headers: headers}) 
      .subscribe(
      (data: Response) => { 
       data = JSON.parse(data['_body']); 
       this.userStatus = data; 
      }, 
      err => console.log(err), // error 
      () => console.log('getUserStatus Complete') // complete 
     ); 
    }  
} 

Teraz, gdy składnik najwyższego poziomu bootstrapped/zainicjowane chcę aby wykonać połączenie do phoney usługi REST (/ restservice/userstatus) założyłem, że zwraca obiekt, który zrobiłem w rodzaju jak tak (to jest od import {UserStatus} from './types/types.ts'):

export class UserStatus { 

    constructor (
     public appOS?: any , // can be null 
     public firstName: string, 
     public formerName?: any, // can be null 
     public fullPersId: number, 
     public goldUser: boolean, 
     public hasProfileImage: boolean, 
     public hideMoblieNavigationAndFooter: boolean, 
     public persId: string, 
     public profileName: string, 
     public profilePicture: string, 
     public showAds: boolean, 
     public siteId: number, 
     public url: string, 
     public verified: boolean 
    ) { 

    } 
} 

teraz appOS i formerName właściwości mogą potencjalnie być null i podczas wyświetlania odpowiedzi w mojej usłudze REST są one, obiekt JSON wygląda tak:

{ 
    appOS: null, 
    firstName: "Max", 
    formerName: null, 
    fullPersId: 123456789, 
    goldUser: true, 
    hasProfileImage: true, 
    hideMoblieNavigationAndFooter: false, 
    persId: "4RUDIETMD", 
    profileName: "Max Dietmountaindew", 
    profilePicture: "http://myurl.com/images/maxdietmountaindew.jpg", 
    showAds: true, 
    siteId: 1, 
    url: "/profile/maxdietmountaindew", 
    verified: true 
} 

więc struktura danych wysłane z mojego phoney usług i spotkania typu obiektu jednak gdy próbuję przypisać dane z Serwisu resztę składnika w klasie 'this.userStatus = data;' I pojawia się następujący błąd ....

"error TS2322: Type 'Response' is not assignable to type 'UserStatus'. 
    Property 'appOS' is missing in type 'Response'." 

zakładam w moim klasy Type robie coś nie tak z definicji gdzie null są zainteresowane ktoś może zobaczyć, co robię źle lub wyjaśnić, dlaczego ja dostaję błąd. Z góry dziękuję.

Answer 1

Moim zdaniem nie ma sensu, aby umieścić typ na coś, co pochodzi z odpowiedzi http ... Rodzaje istnieje tylko w czasie kompilacji, a nie w czasie wykonywania ...

Zamiast:

this.http.get('/restservice/userstatus', {headers: headers}) 
     .subscribe(
     (data: Response) => { 
      data = JSON.parse(data['_body']); 
      this.userStatus = data; 
     }, 
     err => console.log(err), // error 
     () => console.log('getUserStatus Complete') // complete 
    ); 

użyj:

this.http.get('/restservice/userstatus', {headers: headers}) 
.map((data: any) => data.json()) 
.subscribe(
     (data: any) => { 
      this.userStatus = data; 
     }, 
     err => console.log(err), // error 
     () => console.log('getUserStatus Complete') // complete 
    ); 

Answer 2

Tutaj zadeklarować data jako typ Response

(data: Response) => { // <== 
    data = JSON.parse(data['_body']); 

a tu przypisanie ze zmiennej typu Response do zmiennej typu UserStatus

 this.userStatus = data; 

zatem błędu.

Aby tego uniknąć wystarczy zrobić

this.userStatus = JSON.parse(data['_body']);