在Angular 2中使用subscribe获得http响应后获取[object Object]

Question

ProductService.ts

   getProduct(id: number): Observable<IProduct> {

    return this._http.get(this._productUrl + '/GetById/' + 
           id).map((response: Response) => <IProduct>response.json())           
        .catch(this.errorHandler);     
}

ProductDetailComponent.ts

   getProduct(id: number) {
    this._productService.getProduct(id).subscribe(
        res => {               
            console.log('before component ' + res);     
            this.product = res;
            console.log('after component ' + res);                
        },
        error => this.errorMessage = <any>error),
        console.log('execution complete'); 
}

When receiving result in subscribe it is coming as
execution complete, before component [object Object], after component [object Object]

Answer 1

You are using string concatenation (using the + sign). This way, Javascript will first convert the Object to a string ( [object Object] ). If you don't want that, you could try it like this: console.log('before component', res) .

Note the comma, not a + . This passes the object to console.log as a separate parameter, allowing your browser or CLI to do the rendering. For instance, this way (in the browser) you can expand or collapse the object.

Answer 2

你需要做JSON.stringify

console.log('before component ' + JSON.stringify(res));  

Answer 3

You could also do the following:

console.log('before component',JSON.stringify(res,undefined,2))

to pretty print [Object object] as json object.