An urgent guide request. Loopback,mongodb CURL implementation

Ionic Framework ionic-v3
1

Friends I need an urgent guide about loopback and mongodb, I had to build API with these tools. My problem is this, how to implemet cURL post method for example how should I implement some thing like this , in app.

curl -X POST --header "Content-Type: application/json" --header "Accept: application/json" -d "{
  \"name\": \"GreatNight\",
  \"city\": \"Tehran\"
}" "http://localhost:3000/api/CoffeeShops"

to post data in to database.

3

this is its ajax but i dont know how to us it in app.

$.ajax({
  type: 'POST',
  url: "http://localhost:3000/api/CoffeeShops",
  data: {
    name: "GreatNight",
    city: "Tehran"
  },
  dataType: "json",
  accepts: {
    text: "application/json"
  }
});
4

You want to use https://angular.io/guide/http
(Note that this shows a wrong Angular version by default. You should see which Angular version you use and find the appropriate docs for that one.)

1 Like
6

this is the solution:

html


<ion-content>
  <ion-list>
    <ion-item>
      <ion-label fixed> shop name </ion-label>
      <ion-input type="text"[(ngModel)]="name" > </ion-input>
    </ion-item>

    <ion-item>
      <ion-label fixed> city </ion-label>
      <ion-input type="text" [(ngModel)]="city"> </ion-input>
    </ion-item>

    <ion-item>
      <button ion-button block large (click)="post()">post  </button>
    </ion-item>

  </ion-list>

</ion-content>

page2.ts


import { Component } from '@angular/core';
import { Http, Headers, RequestOptions } from '@angular/http';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/toPromise';

import { NavController, NavParams } from 'ionic-angular';

@Component({
  selector: 'page-page2',
  templateUrl: 'page2.html'
})
export class Page2 {
  public name;
  public city;
  constructor( public navCtrl: NavController, public navParams: NavParams, public http: Http) {   }

post(){
let headers = new Headers(
{
  'Content-Type' : 'application/json'
});
let options = new RequestOptions({ headers: headers });

let data = JSON.stringify({
  name:this.name,
  city:this.city
});
console.log(data);
let url = 'http://localhost:3000/api/CoffeeShops';
return new Promise((resolve, reject) => {
  this.http.post(url, data, options)
  .toPromise()
  .then((response) =>
  {
    console.log('API Response : ', response.json());
    resolve(response.json());
  })
  .catch((error) =>
  {
    console.error('API Error : ', error.status);
    console.error('API Error : ', JSON.stringify(error));
    reject(error.json());
  });
});
}

}
7

The above post has considerable room for improvement.

  • name and city should be typed
  • there is no need to explicitly declare them public, that is the default
  • there is no point in having post() return anything; nobody is listening
  • there is no need to make the headers or RequestOptions; Http will do this for you
  • similarly no need to stringify; simply pass the object as the body
  • even if we were wanting to return something, there is no need to explicitly instantiate a Promise
1 Like
8

@rapropos Thank you so much, I will correct them, now.