How to make AJAX call with angular2(ts)?

Question

How to make AJAX call with angular2(ts)? I read the tutorial on angularjs.org. But there is nothing about AJAX. So I really want to know how to make AJAX call with angular

Answer 1

json-data.service.ts

import { Injectable } from '@angular/core';
import { Http, Response, RequestOptions, Headers } from "@angular/http";
import 'rxjs/add/operator/map';
import { Observable } from 'rxjs/Observable';

@Injectable()
export class JsonDataService {
  errorMessage: any;

  constructor(private http: Http) {
  }

 getData(): Observable {
    console.log('Retriving Data from Server.......');
    return this.http.get('http://883.82.3:8086/restfullDataApi/UserService/jsondata')
      .map(this.extractData)
      .catch(this.handleError);
  }

getSolrData() {
    let headers = new Headers({ 'Content-Type': 'application/json' });
    let options = new RequestOptions({ headers: headers });
    let url = "http://883.8.2:8086/PI3_Solr_WebService/solrService"; /
    return this.http.post(url).map((res: Response) => res.json());
  }
   let body = res.json();
    return body || [];
  }

  private handleError(error: any) {
    // In a real world app, we might use a remote logging infrastructure
    // We'd also dig deeper into the error to get a better message
    let errMsg = (error.message) ? error.message :
      error.status ? `${error.status} - ${error.statusText}` : 'Server error';
    console.error(errMsg); // log to console instead
    alert("Server Error!");
    return Observable.throw(errMsg);
  }