サービスからコンポーネントへの非同期データ - http POSTのデータを返す

Question

http POST要求を使用してバックエンドにデータを送信し、データを保存し、バックエンドからreceiptNoという特定の要素も返しました。

サービスに領収書番号がありますが、サービスを呼び出すコンポーネントに送信できません（サービスからコンポーネントに送信されている非同期データのハングアップを取得できませんでした）

コンポーネントに加入し現在で次のエラーを取得：

プロパティは、型「ブール」上には存在しません「購読」が。

私のコンポーネント：

import { Component, NgZone,OnInit } from '@angular/core'; 
import { NavController, NavParams } from 'ionic-angular'; 
import { Printer, PrintOptions, Toast } from 'ionic-native'; 
import {LoanService} from '../../app/services/loan.service'; 
import {CollectionService} from '../../app/services//CollectionService'; 
import { CollectpaymentsPage } from '../collection/collection.component'; 
import { Collection} from '../../../../common/classes/Collection'; 
import {Observable} from 'rxjs/Rx'; 
import 'rxjs/add/operator/map'; 



@Component({ 
    selector: 'page-receipt', 
    templateUrl: 'receipt.html' 
}) 
export class ReceiptPage { 

    base64Image: any; 
    public loan: Dictionary; 
    public mobile: any; 
    // public form: any; 
    public amount: any; 
    public collection: Collection; 
    public data; 
    public res; 

    constructor(public navCtrl: NavController,public collectionService: CollectionService, public zone: NgZone, public params: NavParams) { 
     this.loan = params.get('loan'); 
     this.mobile= params.get(this.mobile); 
     // this.form= params.get('form'); 
     this.amount= params.get('amount'); 
     this.collection = params.get('collectionData'); 


    } 


    ngOnInit() { 
     console.log("this is receipt collectionss page") 
     console.log(this.collection) 
     console.log("from receipt ts") 

     // XXX check for return value and errors 
      // this.collectionService.saveCollection(this.collection); 

      this.collectionService.saveCollection(this.collection) 
       .subscribe(result => this.data = result); 
} 
} 
interface Dictionary { 
    [ index: string ]: string 
} 

私のサービス（collectionService）：

public saveCollection( collection: Collection) { 
     console.log("Collections Form data ") 
     let queryParameters = new URLSearchParams(); 
     let headerParams = new Headers({ 'Content-Type': 'application/json' }); 
     var userToken = JSON.parse(localStorage.getItem('currentUser')); 
     queryParameters.set('token', userToken.token); 

     let requestOptions: RequestOptionsArgs = { 
      method: 'POST', 
      headers: headerParams, 
      search: queryParameters 
     }; 


     console.log(collection) 
     var result = collection.validate() 
     console.log(result) 

     if(! result["isValid"]){ 
      console.log(result["message"]) 
      return false; 

     } 


     const url = this.basePath + '/api/v1/collection'; 

     let headers = new Headers({ 'Content-Type': 'application/json' }); 
     this.http.post(url, collection , requestOptions) 
      .subscribe((response: Response) => { 
       console.log(response); 
       let receiptNo = response.json().receiptNo; 
       console.log("this is return valuevalue") 
       console.log(receiptNo); 
       if(receiptNo){ 
        console.log("tihis is return value"); 
        console.log(receiptNo) 
        return response.json(); 

       } 
       else{ 
        console.log("failedfaileffailefailed") 
        return undefined; 
       } 
      }); 



    } 

Answer 1

OK、それは契約を返されていますので、あなたが使用していた約束

public saveCollection( collection: Collection): Promise<any> { 
    // code 
    return return this.http.post(url, collection , requestOptions) 
     .toPromise() 
     .then((success: Response) => { 
      return 'success' 
     }, (fail: any) => { 
      return 'fail' 
     }) 

this.collectionService.saveCollection(this.collection) 
.then(success => console.log(success), // 'success' 
    fail => console.log(fail)) /// 'fail'` 

Answer 2

を使用するようにしてくださいブール値を返す関数の.subscribe（）それはObservableでなければなりません。

このコードは、コンポーネントのコードで

this.collectionService.saveCollection(this.collection) 
      .subscribe(result => this.data = result);