title: use service to get json data
body: <p>I want to create a service that get a <code>json</code> data.</p>
  
  <p><strong>controller :</strong></p>
  
  <pre><code>angular.module('app')
      .controller('serviceCtrl',['$scope', 'Services', function($scope,Services) {
        $scope.title="services";
        $scope.services = Services.get();
  }]);
  </code></pre>
  
  <p><strong>factory service :</strong></p>
  
  <pre><code>angular.module('app')
          .factory('Services', function(){
              return $http.get('/api/services.json').then(function(response){
                  return response.data;
              })
          });
  </code></pre>
  
  <p><strong>service.html :</strong></p>
  
  <pre><code>&lt;div ng-repeat="service in Services"&gt;
      &lt;div class=" thumbnail-services col-xl-3 col-lg-4 col-md-4 col-sm-6 col-xs-6"&gt;
          &lt;figure class="figure"&gt;
              &lt;img src="http://placehold.it/350x350" class="figure-img img-fluid rounded" alt="{{Services.name}}"&gt;
              &lt;figcaption class="figure-caption"&gt;
              &lt;a href=""&gt;
                  &lt;h3&gt;{{Services.name}}&lt;/h3&gt;
              &lt;/a&gt;
              &lt;/figcaption&gt;
          &lt;/figure&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>but i am getting an error <code>ReferenceError: $http is not defined</code></p>
  
  <p>is it right the way i create the factory ?</p>