<!DOCTYPE html>
<html ng-app="myApp">

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

  <body>
    <ion-content class="has-subheader" ng-controller="myCtrl">
      <ion-list>
        <ion-item ng-repeat="item in posts" class="item-thumbnail-left item-text-wrap">
          <img src="http://placehold.it/100x100" alt="photo" />
          <h2>{{item.title}}</h2>
          <h4>Place</h4>
          <p style="font-size:12px; line-height:16px;">Quisque quis sem a velit placerat vehicula quis nec felis. Mauris posuere, nisl vitae condimentum luctus, tellus enim blandit orci, quis efficitur nibh libero eget dui. Aliquam fermentum velit quis sem molestie.</p>
        </ion-item>
      </ion-list>
    </ion-content>
  </body>

</html>
(function() {

  var myApp = angular.module('myApp', []);
  
  var GetPosts = function($scope,$http){
    $http.get('http://jsonplaceholder.typicode.com/posts').then(function(results) {
      $scope.posts = results.data;
      console.log(results.data);
    }, function(err) {
      console.error('ERR', err);
    })
  }
  myApp.controller('myCtrl', ['$scope', '$http', GetPosts]);

}());