CODEWITHSUNDEEP
angularasynchronoustypescriptionic-frameworkhttp-post
hemanth koganti
hemanth koganti

Reputation: 103

Async data from service to Component-(return data from http POST)

I have used a http POST request to send data to the backend and save the data, also returned a certain element called receiptNo from the backend.

Now I have the receiptNo in the service but I am unable to send it to the component that is calling the service(couldn't get the hang of the async data that is being sent to the component from the service)

getting the following error at the subscribe present in the component:

Property 'subscribe' does not exist on type 'boolean'.

my Component:

   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
}

my service(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;
                }
            });



    }

Upvotes: 1

Views: 2020

Answers (2)

Roman C
Roman C

Reputation: 1

You have used .subscribe() on the function that returns a boolean value, but it should be Observable.

This code doesn't work

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

Upvotes: 0

looffee
looffee

Reputation: 81

ok, it's because returned Subscription, try to use Promise

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'`

Upvotes: 2

Related Questions