<!DOCTYPE html>
<html ng-app>

  <head>
    <script data-require="angular.js@1.2.25" data-semver="1.2.25" src="https://code.angularjs.org/1.2.25/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-controller="httpController">
    <h1>Explaining Http Service using git api</h1>
    <div>
      {{error}}
    </div>
    <div>Name:{{details.name}}</div>
    <div>Blog:{{details.blog}}</div>
    <div>
      <img ng-src="{{details.avatar_url}}" title={{details.name}}> 
    </div>
    <div ng-repeat="i in movies">
      <div>{{i.MovieName}}</div>
    </div>
  </body>

</html>
// Code goes here

//Explaining $http service using simple github api call

var httpController = function($scope,$http){
  
  var onFetchComplete = function(success){
    //angular return data in data attribute
    $scope.details = success.data;
  };
  
  var onError = function(error){
    $scope.erros = "Unable to fetch the data";
  };
  
  var fetchCompleted = function(success){
    $scope.movies =success.data;
  };
  var fetchFailed = function(error){
    $scope.erros =error.data;
  };
  $http.get("https://api.github.com/users/rahulsahay19").
  then(onFetchComplete,onError);
  
  $http.get("http://rahulsahay19-001-site1.smarterasp.net/api/movies").then
  (fetchCompleted,fetchFailed);
};
/* Styles go here */