在Angular中使用Promise的正确方法？

Question

我有一个方法：

public get(): Promise<Study[]> { 
return this.http.post('', data, options) 
     .toPromise() 
     .then(response => { console.log(response) }) // response.json().result as Study[] 
     .catch(this.handleError); 
} 

private handleError(error: any): Promise<any> { 
    console.error('getStudyPlanView: ', error); 
    return Promise.reject(error.message || error); 
    } 

是否使用无极正确的方法？ 我打电话承诺喜欢为：

this.planningService.getStudyPlanView(this.globalModel.schoolId, this.globalModel.studyPeriodId) 
     .then(result => { }) 
     .catch((error => console.log('ERROR loadStudyPlan():' + error))); 

为什么我需要在public get()使用.then？和.toPromise()有什么区别？低于或高于？

我觉得我做错了什么，因为我要求的承诺后得到一个错误：

Service.ts:82 get: SyntaxError: Unexpected end of JSON input

Answer 1

下面是使用观测量的例子服务：

import { Injectable } from '@angular/core'; 
import { HttpClient, HttpErrorResponse } from '@angular/common/http'; 
import { Observable } from 'rxjs/Observable'; 
import 'rxjs/add/observable/throw'; 
import 'rxjs/add/operator/catch'; 

import { IProduct } from './product'; 

@Injectable() 
export class ProductService { 
    private _productUrl = './api/products/products.json'; 

    constructor(private _http: HttpClient) { } 

    getProducts(): Observable<IProduct[]> { 
     return this._http.get<IProduct[]>(this._productUrl) 
      .catch(this.handleError); 
    } 

    private handleError(err: HttpErrorResponse) { 
     // in a real world app, we may send the server to some remote logging infrastructure 
     // instead of just logging it to the console 
     let errorMessage = ''; 
     if (err.error instanceof Error) { 
      // A client-side or network error occurred. Handle it accordingly. 
      errorMessage = `An error occurred: ${err.error.message}`; 
     } else { 
      errorMessage = `Server returned code: ${err.status}, error message is: ${err.message}`; 
     } 
     console.error(errorMessage); 
     return Observable.throw(errorMessage); 
    } 
} 

这里是组件的方法调用：

ngOnInit(): void { 
    this._productService.getProducts() 
      .subscribe(products => { 
       this.products = products; 
       this.filteredProducts = this.products; 
      }, 
       error => this.errorMessage = <any>error); 
}