Example of http get | Angular | ASP.NET Tutorials

For Consultation : +91 9887575540

Stay Connected :

Getting Data From Server using http GET Method

We use it to make ajax calls to the server.

The Http class provides the get() method for getting a resource, post() for creating it, put() for updating it, delete() for deleting resource and head() for getting metadata regarding a resource.


  • Observables is a new primitive type which acts as a blueprint for how we want to create streams, subscribe to them, react to new values, and combine streams together to build new ones.
  • RxJS stands for *R*eactive E*x*tensions for *J*ava*S*cript, and its a library that gives us an implementation of Observables for JavaScript.


By calling subscribe onto an observable it:

  • 1. Turns the observable hot so it starts producing.
  • 2. Lets us pass in a callback function so we react when anything is pushed onto the final stream in the observable chain.


Step1: Create a Service., It will create myservice.

ng g service myservice

import { Injectable } from '@angular/core';
import { Http, HttpModule } from '@angular/http';
import 'rxjs/add/operator/map';
export class MyserviceService {

  constructor(private _http: Http) { }
  return this._http.get('https://ganesha-51b6f.firebaseio.com/fname.json')



Step 2 : Create App.Component.ts(In the following code if JSON error is occurred then remove .json() from datas.json() )

import { Component } from '@angular/core';
import { OnInit } from '@angular/core';
import { MyserviceService } from 'app/myservice.service';
import { Http , HttpModule } from '@angular/http';

  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  providers: [MyserviceService]
export class AppComponent implements OnInit {
  title = 'app works!';
  constructor(private service: MyserviceService){}
      datas => console.log(datas.json())