 <p>This is the <strong>correct way</strong> to use <code>$http</code> service and <strong>scope variables</strong>.</p> <pre><code>&lt;html ng-app="people"&gt; &lt;head&gt; &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"&gt;&lt;/script&gt; &lt;script type="text/javascript"&gt; var app = angular.module('people', []); app.controller('firstController', ["$scope", "$http", function ($scope, $http) { $scope.store = {}; $scope.store.products = []; $http.get('http://api.randomuser.me').success(function(data){ $scope.user = data.results[0].user; }) }]); &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div id="clk" style="background-color: indigo; widht: 100px; height: 100px"&gt;&lt;/div&gt; &lt;div ng-controller="firstController"&gt; {{ user.email}} &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>